ES6语法规范

啥是ES6

ES的全程ECMAScript，是由ECMA国际标准化组织指定的一项脚本语言的标准化规范。
ES6实际上是一个泛指，泛指ES2015及后续的版本。

为啥要学ES6

废话。

ES6 新增语法

let

ES6中新增的用于声明变量的关键字。

let声明的变量只在所处于的块级作用域有效。

上面的代码中。if后面的大括号即一个块级作用域。所以所谓的块级作用域就是一个大括号所囊括的作用域即块级作用域。

注意：

使用let关键字声明的变量才具有块级作用域，使用var声明的变量不具备块级作用域特性。

上面的代码中，在控制台依然可以看到abc的输出，而num则是undefined。

不存在变量提升：

像上面这行代码如果使用var定义a，则不会报错，而使用let定义之后，会报a没有被定义。

暂时性死区

暂时性死去的意思是，如下面的代码：

这运行会报错，因为在if语句大括号中用let关键字定义的tmp的作用域只在这个大括号内部，所以tmp是与if这个语句相绑定的，在当前if这个大括号中tmp变量的定义在tmp变量赋值的后面，这就会报错，因为tmp还没被定义就先赋值了那就肯定会错。

const

作用：声明常量，常量就是值（内存地址）不能变化的量。

特点有：

具有块级作用域特性；
声明常量时必须赋值

常量一旦赋值，值就不可更改

总结一下let、const、var的区别

结构赋值

ES6中允许从数组中提取值，按照对应位置，对变量赋值。对象也可以实现解构。按照一定模式，从数组中或对象中提取值，将提取出来的值赋值给另外的变量。

数组解构

上面的代码就是a=1，b=2，c=3；

如果解构不成功，变量的值为undefined。

对象解构

上面的代码意思是，首先要注意let后面的大括号中不是上面person对象中的属性值，而是三个变量，它们会去person对象中寻找与自己对应匹配的属性，匹配上了则会将这个属性的值赋值给变量。比如name属性的值是lisi，而name变量与name属性是对的上的，所以此时name变量的值就为lisi。

下面是对象解构的另一种写法：

应该很好懂，不解释了。

箭头函数

ES6中新增的定义函数的方式。

上面代码中，()是用来接收参数用的，{}则是函数体的位置。左边const fn是一个变量名，用来接收这个函数。

如果函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号：

箭头函数中的this指向问题

箭头函数不绑定this关键字，箭头函数中的this，指向的是函数定义位置的上下文this。
比如下面的代码：

因为箭头函数本身不绑定this，所以它自己是没有this 的，和传统的函数中的this机制不一样。如果要用箭头函数的this，那么只会调用箭头函数所在区域范围中的this，比如上面的代码中，因为箭头函数被定义在了fn函数当中，所以返回的箭头函数中的this指向的就是fn中的this，即对象obj。

剩余参数

上面代码中，参数args前加三个点，则说明这是一个参数数组。

剩余参数还可以和解构配合使用：

这个开发中应该不常用，和Java中的可变参数一样。

拓展运算符（展开语法）

为什么输出时逗号没有了呢？
这是因为…ary其实就等于1,2,3，而这三个逗号在console.log中被当做了log方法中的逗号分隔符而被去掉了，所以输出了1 2 3；

Array的拓展方法：构造函数方法:Array.from()

将类数组或可遍历对象转换为真正的数组。

方法也可以接收第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

Array的拓展方法：实例方法：find()

上面的代码意思为：定义了一个arg对象数组，这个对象数组中有两个对象，然后现在我们要调用find函数去查找在arg对象数组中id为2的对象。

Array的拓展方法：实例方法：findIndex()

Array的拓展方法：实例方法：includes()

String的拓展方法：模板字符串

String的拓展方法：实例方法：startsWith()和endsWith()

String的拓展方法：实例方法：repeat()

Set 数据结构

ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

Set数据结构：实例方法

Set数据结构：遍历