1. let和const

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
let:
  //局部作用域

var a = [];
for (let i = 0; i < 10; i++){
a[i] = function () {
console.log(i)
}
}
a[2]() //2
   a[5]() //5
  //不会存在变量提升
 
 console.log(a); //undefined
  {
  var a = 1;
  var a = 10
}
  console.log(a); //10
  //变量不能重复声明
  
let a = 1;
  let a = 10;
  console.log(a); //10 // const:局部作用域,不会存在变量提升,不能重复声明,只声明常量,不可变的量
</script>
</body>
</html>

2. es6的箭头函数

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function add(x) {
return x
}; console.log(add(1)); //1 let add1 = function (x) {
return x
};
console.log(add1(10)); //10 let add2 = (x) => x;
console.log(add2(20)); //20
</script>
</body>
</html>

3. es6的对象

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
let person1 = {
methods:{
fav:function () {
}
},
name:"ritian",
age:30,
fav:function () {
console.log(this); //this指当前的person1对象
console.log(this.name);
console.log(this.age);
}
};
person1.fav(); let person2 = {
name:"ritian2",
age:30,
fav:() => {
console.log(this); //this指定义person的父级对象(window)
console.log(this.name);
}
};
person2.fav(); let person3 = {
name:"ritian",
fav(){
console.log(this); //当前this,即person3
}
};
person3.fav()
</script>
</body>
</html>

4. es6的类

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>4</title>
</head>
<body>
<script>
function Vue(name,age) {
this.name = name;
this.age = age;
console.log(this.name); //ritian
console.log(this.age); //18
} //基于原型给对象声明方法
Vue.prototype.showName = function(){
console.log(this.name);
};
Vue("ritian",18); class Person{
constructor(name="ritian",age=18){
this.name = name;
this.age = age;
}
showname(){
console.log(this.name);
}
showage(){
console.log(this.age);
}
} let V = new Person();
V.showname(); //ritian
V.showage(); //18
</script>
</body>
</html>

es6的基本用法的更多相关文章

  1. ES6语法 promise用法

    ES6语法 promise用法 function doSomething(){ return new Promise((resolve,reject)=>{ resolve('jjjj');// ...

  2. es6的promise用法详解

    es6的promise用法详解 promise 原理 promise是es6的异步编程解决方案, 是es6封装好的对象: 一个promise有三种状态:Pending(进行中).Resolved(已完 ...

  3. ES6之Promise用法详解

    一 前言 本文主要对ES6的Promise进行一些入门级的介绍.要想学习一个知识点,肯定是从三个方面出发,what.why.how.下面就跟着我一步步学习吧~ 二 什么是Promise 首先是what ...

  4. ES6 Class基本用法

    JavaScript 语言中,生成实例对象的传统方法是通过构造函数.下面是一个例子. function Point(x, y) { this.x = x; this.y = y; } Point.pr ...

  5. es6 reduce的用法

    一.forEach回调函数参数,item(数组元素).index(序列).arr(数组本身)循环数组,无返回值,不改变原数组不支持return操作输出,return只用于控制循环是否跳出当前循环 二. ...

  6. 非vue等框架中html 中使用es6的模块用法小结

    以下是html中使用es6模块化引入的方法 一.html中的引入 <!DOCTYPE html> <html lang="en"> <head> ...

  7. 数组的高级应用含ES6 for of 用法

    // 在ES5中常用的10种数组遍历方法: // 1. 原始的for循环语句 // 2. Array.prototype.forEach数组对象内置方法 // 3. Array.prototype.m ...

  8. es6 map的用法

    let arr =[ {title:'aaaa',read:100,hot:true}, {title:'bbbb',read:50,hot:false}, {title:'ccc',read:100 ...

  9. ES6中Class的用法及在微信小程序中的应用实例

    1.ES6的基本用法 ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6 的class可以看作只是一个语法糖,它的绝 ...

随机推荐

  1. c#编写的基于Socket的异步通信系统封装DLL--SanNiuSignal.DLL

    SanNiuSignal是一个基于异步socket的完全免费DLL:它里面封装了Client,Server以及UDP:有了这个DLL:用户不用去关心心跳:粘包 :组包:发送文件等繁琐的事情:大家只要简 ...

  2. 梭子鱼VS多备份 虽殊途却同归

    备份,对于企业来说,不仅是一个已经拥有多年历史的传统IT工作,还关系着企业自身的生死存亡.在云计算时代下,备份业务成为企业的必选项,已经成为云计算服务最为热门的领域之一.基于云的备份正在深刻改变着备份 ...

  3. 打开并锁定一个文件(使用LockFile API函数)

    var aHandle : THandle; aFileSize : Integer; aFileName : String; procedure TForm1.Button3Click(Sender ...

  4. 如何让你的Sublime和Codeblocks支持C++11

    闲来没事看了一下C++11,比起C++0x多了很多新功能,像auto变量,智能指针等,g++4.7以上版本也提供了对C++11的支持,但是,如何在你的编辑器上执行C++11代码呢? 刚开始以为用法和以 ...

  5. C# 中使用不安全代码(unsafe、指针)实践

    命题 根据指定的字符集合(字典),按排列组合的规则(允许重复),生成指定长度的所有字符串.如下代码: class Program { static void Main(string[] args) { ...

  6. ZooKeeper学习第五期--ZooKeeper管理分布式环境中的数据(转)

    转载来源:https://www.cnblogs.com/sunddenly/p/4092654.html 引言 本节本来是要介绍ZooKeeper的实现原理,但是ZooKeeper的原理比较复杂,它 ...

  7. Linux常用实用命令

    Linux是我们开发人员必不可少的系统,也是经常接触到的.然而,Linux命令比较多,有些不常用也难记住.那么,我们如何更高效的使用Linux命令,而又不必全面地学习呢?今天就给大家分享一下我在开发过 ...

  8. 你必须了解的java内存管理机制(三)-垃圾标记

    本文在个人技术博客不同步发布,详情可用力戳 亦可扫描屏幕右侧二维码关注个人公众号,公众号内有个人联系方式,等你来撩... 相关链接(注:文章讲解JVM以Hotspot虚拟机为例,jdk版本为1.8) ...

  9. Java多线程学习(吐血超详细总结)

    Java多线程学习(吐血超详细总结) 林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 写在前面的话:此文只能说是java多线程的一个入门,其实 ...

  10. 安装win7和linux [ubuntu14]双系统

    想体验一把ubuntu18.10最新桌面版的快感,但是windows上面的数据又删除不得,所以百度了一下,win7和linux双系统的安装教程. 一.首先在win7上创建新的分区 https://ji ...