ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准，已经在2015年6月正式发布了。Mozilla公司将在这个标准的基础上，推出JavaScript 2.0。ECMA Script,JavaScript的语言标准。至今已经发布5年多了，但是因为蕴含的语法之广，完全消化需要一定的时间，这里我总结了部分ES6，以及ES6以后新语法的知识点，使用场景，希望对各位有所帮助
一、let和const
let
用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效，即let声明的是一个块作用域内的变量。
特点：
- 不存在变量提升。
- 暂时性死区——只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。
- 不允许重复声明。
- 块级作用域——被{}包裹，外部不能访问内部。
应用案例与分析：
// 使用var
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
});
} // => 5 5 5 5 5
// 使用let
for (let i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
});
} // => 0 1 2 3 4
上面使用let的代码中，变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算所以最后能正常输出i的值。
注意：
for循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域，所以我们可以在循环体内部访问到i的值。
let和var全局声明时，var可以通过window的属性访问而let不能。
const
const声明一个只读的常量。一旦声明，常量的值就不能改变。const实际上保证的是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的，至于它指向的数据结构是不是可变的，就完全不能控制了。因此，将一个对象声明为常量必须非常小心。
因此，我们使用const时，不能只声明而不初始化值，否则会报错：
const a;
// SyntaxError: Missing initializer in const declaration
const的其他特性和let很像，一般推荐用它来声明常量，并且常量名大写。
二、数组的扩展
扩展运算符
扩展运算符（spread）是三个点（...），将一个数组转为用逗号分隔的参数序列
应用场景：
1 复制数组
const a1 = [1, 2];
const a2 = [...a1];
2 合并数组
const arr1 = ['1', '2'];
const arr2 = ['c', {a:1} ];
// ES6 的合并数组
[...arr1, ...arr2]
注：这两种方法都是浅拷贝，使用的时候需要注意。
3 将字符串转化为数组
使用扩展运算符能够正确识别四个字节的 Unicode 字符。凡是涉及到操作四个字节的 Unicode 字符的函数，都有这个问题。因此，最好都用扩展运算符改写。
[...'xuxi']
// [ "x", "u", "x", "i" ]
4 实现了 Iterator 接口的对象
let nodeList = document.querySelectorAll('div');
let arr = [...nodeList];
上面代码中，querySelectorAll方法返回的是一个NodeList对象。它不是数组，而是一个类似数组的对象。扩展运算符可以将其转为真正的数组，原因就在于NodeList对象实现了 Iterator 。
Array.from()
Array.from方法用于将类对象转为真正的数组：类似数组的对象和可遍历的对象（包括 ES6 新增的数据结构 Set 和 Map）。
实际应用中我们更多的是将Array.from用于DOM 操作返回的 NodeList 集合，以及函数内部的arguments对象。
// NodeList对象
let nodeList = document.querySelectorAll('p')
let arr = Array.from(nodeList)
// arguments对象
function say() {
let args = Array.from(arguments);
}
Array.from还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。
Array.from([1, 2, 4], (x) => x + 1)
// [2, 3, 5]
Array.of()
Array.of方法用于将一组值，转换为数组。Array.of基本上可以用来替代Array()或new Array()，并且不存在由于参数不同而导致的重载。它的行为非常统一。
Array.of() // []
Array.of(undefined) // [undefined]
Array.of(2) // [21]
Array.of(21, 2) // [21, 2]
数组实例方法includes()
Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值。该方法的第二个参数表示搜索的起始位置，默认为0。如果第二个参数为负数，则表示倒数的位置，如果这时它大于数组长度（比如第二个参数为-4，但数组长度为3），则会重置为从0开始。
[1, 4, 3].includes(2) // true
[1, 2, 4].includes(3) // false
[1, 5, NaN, 6].includes(NaN) // true
三、对象的扩展
对象的扩展运算符
对象的扩展运算符（...）用于取出参数对象的所有可遍历属性，拷贝到当前对象之中，等同于使用Object.assign()方法。
let a = {
w: 'xu', y: 'xi'
}l
et b = {
name: '12'}let ab = {
...a, ...b
};
// 等同于
let ab = Object.assign({}, a, b);
Object.is()
用来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致;不同之处只有两个：一是+0不等于-0，二是NaN等于自身。
+0 === -0 //true
NaN === NaN // false
Object.is(+0, -0) // false
Object.is(NaN, NaN) // true
Object.assign()
用于对象的合并，将源对象的所有可枚举属性，复制到目标对象; 如果只有一个参数，Object.assign会直接返回该参数; 由于undefined和null无法转成对象，所以如果它们作为参数，就会报错; 其他类型的值（即数值、字符串和布尔值）不在首参数，也不会报错。但是，除了字符串会以数组形式，拷贝入目标对象，其他值都不会产生效果。
// 合并对象
const target = { a: 1, b: 1 };
const source1 = { b: 2, c: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}
// 非对象和字符串的类型将忽略
const a1 = '123';
const a2 = true;
const a3 = 10;
const obj = Object.assign({}, a1, a2, a3);
console.log(obj); // { "0": "1", "1": "2", "2": "3" }
注意点：
Object.assign方法实行的是浅拷贝，而不是深拷贝。也就是说，如果源对象某个属性的值是对象，那么目标对象拷贝得到的是这个对象的引用。
对于嵌套的对象，遇到同名属性，Object.assign的处理方法是替换，而不是添加
Object.assign可以用来处理数组，但是会把数组视为对象。
Object.assign([1, 2, 3], [4, 5])
// [4, 5, 3]
Object.assign只能进行值的复制，如果要复制的值是一个取值函数，那么将求值后再复制。
const a = {
get num() { return 1 }
};
const target = {};
Object.assign(target, a)
// { num: 1 }
应用场景：
- 为对象添加属性和方法
- 克隆/合并对象
- 为属性指定默认值
Object.keys()
返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历属性的键名。
const obj = { 100: '1', 2: '2', 7: '3' };
Object.values(obj)
// ["100", "2", "7"]
Object.values()
返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历属性的键值。注意：返回数组的成员顺序：如果属性名为数值的属性，是按照数值大小，从小到大遍历的。
const obj = { 100: '1', 2: '2', 7: '3' };
Object.values(obj)
// ["2", "3", "1"]
四、set和map数据结构
set
ES6提供了新的数据结构Set,类似于数组，但是成员的值都是唯一的，没有重复的值。Set本身是一个构造函数，用来生成Set数据结构。
实例属性和方法：
- add(value)：添加某个值，返回Set结构本身。
- delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。
- has(value)：返回一个布尔值，表示该值是否为Set的成员。
- clear()：清除所有成员，没有返回值。
s.add(1).add(3).add(3);
// 注意3被加入了两次
s.size // 2
s.has(1) // true
s.has(2) // false
s.delete(3);
s.has(3) // false
可进行遍历操作：
- keys()：返回键名的遍历器
- values()：返回键值的遍历器
- entries()：返回键值对的遍历器
- forEach()：使用回调函数遍历每个成员
Set的遍历顺序就是插入顺序，这个特性有时非常有用，比如使用Set保存一个回调函数列表，调用时就能保证按照添加顺序调用。
应用场景：
// 数组去重
let arr = [1，2，2，3];
let unique = [...new Set(arr)];
// or
function dedupe(array) {
return Array.from(new Set(array));
}
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
// 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}
// 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}
// 差集
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}
map
类似于对象，也是键值对的集合，各种类型的值（包括对象）都可以当作键。Map结构提供了“值与值”的对应，是一种更完善的Hash结构实现。
实例属性和方法:
- size属性: 返回Map结构的成员总数。
- set(key, value): set方法设置key所对应的键值，然后返回整个Map结构。如果key已经有值，则键值会被更新，否则就新生成该键,set方法返回的是Map本身，因此可以采用链式写法。
- get(key) : get方法读取key对应的键值，如果找不到key，返回undefined。
- has(key) : has方法返回一个布尔值，表示某个键是否在Map数据结构中。
- delete(key) : delete方法删除某个键，返回true。如果删除失败，返回false。
- clear() : clear方法清除所有成员，没有返回值。
遍历方法和set类似，Map结构转为数组结构，比较快速的方法是结合使用扩展运算符（...）：
let map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
[...map.keys()]
// [1, 2, 3]
[...map.values()]
// ['one', 'two', 'three']
[...map.entries()]
// [[1,'one'], [2, 'two'], [3, 'three']]
[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]
数组转map：
new Map([[true, 7], [{foo: 3}, ['abc']]])// Map {true => 7, Object {foo: 3} => ['abc']}
Map转为对象:
function strMapToObj(strMap) {
let obj = Object.create(null);
for (let [k,v] of strMap) {
obj[k] = v;
}
return obj;
}
let myMap = new Map().set('yes', true).set('no', false);
strMapToObj(myMap)
// { yes: true, no: false }
对象转为Map：
function objToStrMap(obj) {
let strMap = new Map();
for (let k of Object.keys(obj)) {
strMap.set(k, obj[k]);
}
return strMap;
}
objToStrMap({yes: true, no: false})
// [ [ 'yes', true ], [ 'no', false ] ]
总结
总的来说，虽然支持es6的情况到目前还不是很乐观，但es6的新语法特性让前端和后端的差异越来越小了，这是一个新时代的开始，我们必须要了解这些新的前沿知识，才能跟上时代的步伐。