access令两列运算得到新属性_js灵魂整理（四）：es6 相关新特性

1995年，Netscape更名为诞生javascript，成为英特网的必备组件,1997年，ECMA组织规定了浏览器脚本语言的标准，并将javascript称之为ECMAScript，并发布第一个版本，因此可以把ECMAScript是JavaScript的规格，JavaScript是ECMAScript的一种实现，日常用语中，两者可以等同。在经过了20年测沉淀与发展，2015年6月 ECMAScript6 正式发布，下面我们来看看他带来的一些新特性。

1、const、let关键字

const：申明变量必须赋值初始化，无法从新赋值（通常用于自身不变更类型数据申明）

let: 申明变量可以从新赋值（通常用于变量类型数据声明）

为了规避var关键字变量提升带来的问题，let,const 关键字由此而生，let、const同一作用域只能声明一次，存在变量提升，不做初始化操作，存在暂时性死区。

2、字符串扩展：

2.1、方便字符串拼接,如 ：`模板字面量测试${name}`，

2.2、加强Unicode的支持, "u{41}u{42}u{43}" ==="ABC"

3、解构赋值：结构解体，重新构建，是赋值运算符的扩展，可分有结构目标（左边）解构源（右边）两部分，解构赋值模型包括：可忽略、剩余解构、不完全解构等模型，具体可参考es6解构赋值相关文档，这里不做详细介绍。

4、展开运算符（"..."）：字面量对象展开为多个元素

作用：结合数组、获取剩余参数（rest）、获取函数可变参数、对象解构赋值，对象的扩展

注意：当展开运算符在对象扩展的解构赋值使用时，必须为最后一个参数，而且不能赋值继承至原型对象的属性,在扩展中有有取值函数get，会被立即执行如下图：

5、箭头函数

ES6中，箭头函数与java的lambda表达式类似，跟前端开发者带来了极其舒适的开发体验，但是也有以下开发者需要注意的地方：

5.1、声明方式：普通函数能使用函数声明或则函数表达式声明，箭头函数只能为表达式声明的匿名函数。

5.2、this指向：普通函数中，this指向调用它的对象，或者指向构造函数创建的对象实例。在箭头函数中，箭头函数本身不创建this,他通过捕获执行上下文中的this为自己所用。this指向问题，参考下篇。

5.3、其他：箭头函数不具有函数生成器（Generator）、不具有原型对象、不具有arguments、不具有super等，因此，箭头函数不能作为构造函数使用。

5.4、箭头函数兼容（babel）及实现：可理解为箭头函数向下兼容，与普通函数的相互转换。后文AST篇具体介绍。

6、新增数据结构： 在ES6中新增Set、WeakSet、Map、WeakMap数据结构，方便开发者使用。

6.1、Set:一种集合的数据结构，类似于数组。Set中所有的成员无序唯一。在Set中加入的成员不会发生类型转换 ,对于成员中存在对象，只针对对象键去重，并取后一个定义值。

6.2、WeakSet:类似Set数据结构，但WeakSet的成员只能是具有 Iterable (具有迭代行为的对象)接口的对象，而且每个成员都是弱引用，所以垃圾回收阶段忽略WeakSet对该对象的应用，从而垃圾能得到及时清理，从而避免内存泄露等问题，因此WeakSet不能被遍历，也不具有keys()、values()、entries（）、foreach()等方法。

6.3、Map: 类似于对象，是一个键值对的集合，解决了传统对象只能以字符串为键值的问题。更完善的实现了hash结构。Map成员为任何具有 遍历器（Iterator:为不同的数据结构提供统一的访问机制)接口、且每个成员都是一个双元素的数组的数据结构

6.4、WeakMap: 类似于Map结构，但是WeakMap的必须为一个对象（除null）,键名所指向的对象不标记垃圾回收机制，同WeakSet，但是weakMap弱应用的只是键名，键值不为弱应用，标记垃圾回收机制。

6.5、Map与Set应用: 由上述结构可以看出，Map 结构API更加简洁，在ES6中Array在进行查改删的操作时需要遍历，Set数据结构在进行删改操作时也需要遍历，因此从性能上看优先使用Map数据结构。

在开发中合理利用数据结构，能提升开发效率，增加项目的可维护性，如果有兴趣的同学可以尝试自己实现以上4种数据结构，增加对数据结构的认识和理解。

7、class关键字

在ES6中用class关键字创建类，类只是一个语法糖，原型继承在底层封装起来，ES6 中的类可简单理解为function，class不具有变量提升、类不能重复定义、类没有私有属性和私有方法。类的静态方法（static），只能通过类名调用，可与实例的方法重名,this指向类，可继承等特点。具体实现可参考后文类与function。

8、Promise: Promise 篇详细介绍

9、模块化（Module）：模块化篇详细介绍

10、Proxy与Reflect: Proxy、Reflect、defineProperty篇详细介绍

11、其他：es6除了上述新增特性外，还新增了以下许多特性

正则扩展：matchAll、后行断言（先行断言a只出现在b之前如：/a(?=b)/, ES2018后支持后行断言，与先行断言相反 如：/(?<=b)a、y修饰符等

数值(Number)扩展：isFinite、isNaN、parseInt(移植到Number)、parseFloat(移植到Number)、isInteger、EPSILON（极小常量）、isSafeInteger(验证整数范围-2^53-2^53)、Math扩展、BigInt等

数组（Array）扩展：find、findIndex、keys、values、entries、fill、flat、flatMap、includes、from、of等

对象（Object）扩展及新增方法：属性名表达式、链判断运算符（es2020）、is、assign(对象合并，浅拷贝)、getOwnPropertyDescriptor等

ArrayBuffer: 操作二进制数据的一个接口，node篇做介绍。

总结：ES6发布使得javascript语法更加丰满，日常使用中也更加灵活。希望大家跟上发展的脚步，积极提升自身开发能力，别路过浩如烟海的知识，最终却都形同陌路。

下一篇：js灵魂整理（五）：this 指向问题