ECMAScript 6 入门之 展开运算符（...）

原文链接：http://www.jianshu.com/p/ae0a9ec1f8d6
阮老师的《ECMAScript 6 入门》教程，为了之后方便自己随时查看。

参考 ：http://mjzhang.cn/

函数调用中使用展开运算符，展开参数

在以前我们会使用apply方法来将一个数组展开成多个参数：

function test(a, b, c) { }
var args = [0, 1, 2];
test.apply(null, args);

如上，我们把args数组当作实参传递给了a,b,c，这边正是利用了Function.prototype.apply的特性。

不过有了ES6，我们就可以更加简洁地来传递数组参数：

function test(a,b,c) { }
var args = [0,1,2];
test(...args);

合并数组

在ES6的世界中，我们可以直接加一个数组直接合并到另外一个数组当中：

var arr1=['a','b','c'];
var arr2=[...arr1,'d','e']; //['a','b','c','d','e']

展开运算符也可以用在push函数中，可以不用再用apply()函数来合并两个数组：

var arr1=['a','b','c'];
var arr2=['d','e'];
arr1.push(...arr2); //['a','b','c','d','e']

 

用于解构赋值

解构赋值也是ES6中的一个特性，而这个展开运算符可以用于部分情景：

let [arg1,arg2,...arg3] = [1, 2, 3, 4];
arg1 //1
arg2 //2
arg3 //['3','4']

展开运算符在解构赋值中的作用跟之前的作用看上去是相反的，将多个数组项组合成了一个新数组。

不过要注意，解构赋值中展开运算符只能用在最后：

let [arg1,...arg2,arg3] = [1, 2, 3, 4]; //报错

 

类数组对象变成数组

展开运算符可以将一个类数组对象变成一个真正的数组对象：

var list=document.getElementsByTagName('div');
var arr=[..list];

 

list是类数组对象，而我们通过使用展开运算符使之变成了数组。

ES7草案中的对象展开运算符

ES7中的对象展开运算符符可以让我们更快捷地操作对象：

let {x,y,...z}={x:1,y:2,a:3,b:4};
x; //1
y; //2
z; //{a:3,b:4}

 

如上，我们可以将一个对象当中的对象的一部分取出来成为一个新对象赋值给展开运算符的参数。

同时，我们也可以像数组插入那样将一个对象插入另外一个对象当中：

let z={a:3,b:4};
let n={x:1,y:2,...z};
n; //{x:1,y:2,a:3,b:4}

另外还要很多用处，比如可以合并两个对象：

let a={x:1,y:2};
let b={z:3};
let ab={...a,...b};
ab //{x:1,y:2,z:3}

扩展(集合的运算)

 

unction(currentValue, index,arr)

必须。函数，数组中的每个元素都会执行这个函数
函数参数:

参数	描述
currentValue	必须。当前元素的值
index	可选。当前元素的索引值
arr	可选。当前元素属于的数组对象

(1) 将集合转化为数组；
(2) 执行需要的运算；
(3) 将结果转化回集合。 
-并集运算-
new Set([...setA,...setB]);

-交集运算-

　new Set([...setA].filter(x => setB.has(x)));

　-差集-
   new Set([...setA].filter(x => !setB.has(x)));