JavaScript ES6 spread 运算符

插入数组：
看看如下代码，不使用扩展语法：

var mid = [3, 4];
var arr = [1, 2, mid, 5, 6];

console.log(arr);  // [1, 2, [3, 4] , 5, 6]

上面这段代码将得到一个嵌套数组的数组。大部分情况，我们希望一个 array（mid） 展开后再插入到另一个 array（arr） 中。

使用 spread 操作符我们可以这样：

var mid = [3, 4];
var arr = [1, 2, ...mid, 5, 6];

console.log(arr); // [1，2，3，4，5，6]

展开数组作为参数
当一个函数接收多个参数，比如 Math.max，当我们有一个数组需要找到你了的最大值，我们可以使用如下代码进行调用。

var arr = [2, 4, 8, 6, 0];

function max(arr) {
  return Math.max.apply(null, arr);
}

console.log(max(arr)); // 8

如果这时候使用 spread 运算符会变得非常方便。

var arr = [2, 4, 8, 6, 0];
var max = Math.max(...arr);

console.log(max); // 8

复制数组
用数组给新数组赋值只是获取到数组引用，并没有达到深复制的效果。

var arr = ['a', 'b', 'c'];
var arr2 = arr;

arr2.push('d');

console.log(arr);// ["a", "b", "c", "d"]

有多重方法可以实现深复制，但是使用 spread 操作符是最简洁的一种实现：

var arr = ['a', 'b', 'c'];
var arr2 = [...arr];

arr2.push('d');

console.log(arr);  // ["a", "b", "c"]

展开 String
如果想将字符串转为字符数组，如果不实用展开操作：

var str = "hello";
"hello".split('') // ["h", "e", "l", "l", "o"]

使用展开操作符可以这样写：

var str = "hello";
var chars = [...str]; // ["h", "e", "l", "l", "o"]

展开 Object
我们还可以对对象进行展开，如果有两个对象，有不同的 key-value, 我们需要将这两个对象合并起来 (需要使用 Object rest spread transform)，我们可以这样：

let Obj1 = {
 key1: 'value1'
}

let Obj2 = {
 key2: 'value3'
}

let concatValue = {
 ...Obj1,
 ...Obj2
}
console.log(concatValue) // {key1: 'value1', key2: 'value2'}