扩展运算符...的应用

数组、对象、字符串

1-1 函数调用

function add(x, y) {
	return x + y;
}
add(...[4, 39])

function f(v, w, x, y, z) {}
f(-1, ...[0, 1], 2, ...[3])

1-2 往数组里push多个元素

var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2)
console.log(arr1)    // [0,1,2,3,4,5]

1-3 替代函数的apply方法

function(x, y, z) {
	var args = [0, 1, 2];
	f.apply(null, args);    // ES5的写法
	f(...args)     // ES6的写法
}

1-4 下一个数组的最大数简化

Math.max.apply(null, [2, 3, 44])     // Es5的写法
Math.max(...[2, 3, 4])    // ES6的写法

1-5 扩展运算符后面可以放表达式

const arr = [...(5>0?['a']:[]),'b']
console.log(arr)

1-6 与解构赋值结合，用于生成数组

const a1 = [1, 2];
const a2 = [...a1]; 


const [first, ...rest] = []
first;   // undfined 
rest /// []  

const  [first, ...rest] = ["foo"]
first;    // "foo"
rest;      // []

1-7 合并数组

[...arr1, ...arr2, ...arr3]     // ['a','b','c','d']

1-8 数组的克隆

var arr1 = [0, 1, 2]
var arr2 = [...arr1]
arr1[0] = 100
console.log(arr2);  // [0, 1, 2]

/* 乍一看，arr2与arr1不共用引用地址，arr2不随着arr1变化，接着往下看 */

var arr1 = [0, [1,11,111], 2];
var arr2 = [...arr1];
arr1[1][0]=100;
console.log(arr2); //[0, [100,11,111], 2]