在项目中，你肯定遇到过将多个数组进行结合的情况，一般的用法可以使用 Array 的concat()方法：
const links = ['link-1','link-2','link3'];
const submits = ['submit-1'];
const elements = links.concat(submits);
你可能想过这样的做法：
const elements = [links, submits];
// [Array[3], Array[1]]
它实际上会把links数组放入到elements的第一个索引，submits数组放入到elements的第二个索引。
使用 ES6 的展开运算符可以方便做这个事情：
const links = ['link-1','link-2','link3'];
const submits = ['submit-1'];
const elements = [...links, ...submits];
console.log(elements)
// ['link-1','link-2','link3', 'submit-1']
展开运算符（用三个连续的点…表示）是 ES6 中的新概念，使你能够将字面量对象展开为多个元素。
下面详解一下展开运算符的其他用途:
合并数组
let a = [1,2,3];
let b = [4,5,6];
let c = [...a,...b]; // [1,2,3,4,5,6]
替代apply
function f(a,b,c){
console.log(a,b,c)
}
let args = [1,2,3];
// 以下三种方法结果相同
f.apply(null,args)
f(...args)
f(1,2,3)
function f2(...args){
console.log(args)
}
f2(1,2,3) // [1,2,3]
function f3(){
console.log(Array.from(arguments))
}
f3(1,2,3) // [1,2,3]
Array.from()（Array.from()方法不太了解的可以点击这里Array.from()方法详解）可以通过以下方式来创建数组对象：
- 伪数组对象（拥有一个 length 属性和若干索引属性的任意对象）
- 可迭代对象（可以获取对象中的元素,如 Map和 Set 等）
let a = [1,2,3];
let b = [4,5,6];
Array.prototype.push.apply(a,b);
// 或
a.push(...b)
// 两种方法取其一
解构赋值
let a = [1,2,3,4,5,6]
let [c,...d] = a
console.log(c); // 1
console.log(d); // [2,3,4,5,6]
//展开运算符必须放在最后一位
字符串转为数组,正确识别 32 位的 Unicode 字符
[...'siva'] // ['s','i','v','a']
[...'x\uD83D\uDE80y'].length // 3
具有 Iterator 接口的对象,转换成数组
扫描二维码关注公众号，回复：
11903625 查看本文章
var nodelist = document.querySelectorAll('div');
console.log([...nodelist]) // 转化成数组
var map = new Map([[1,11],[2,22],[3,33]]);
console.log([...map.keys()]); // [1,2,3]
浅拷贝
//数组
var a = [1,2,4]
var b = [...a]
a.push(6)
console.log(b) // [1,2,4]
//对象
var a = {
a:1}
var b = {
...a}
a.a = 5
console.log(b.a) // 1