JavaScript数组拷贝方法

扩展运算符（浅拷贝）
ES6的扩赞运算符。该方法不能有效的拷贝多维数组。数组/对象值的拷贝是通过引用而不是值复制。

var arr = [1, 2, 3];
var arrCopy = [];
arrCopy = [...numbers];

// 拷贝数组修改原数组不受影响
arrCopy.push(4);
console.log(numbers, numbersCopy);
// [1, 2, 3] ， [1, 2, 3, 4]

for()循环（浅拷贝）
for循环不能有效的拷贝多维数组。使用的是=运算符，它在处理数组/对象值的拷贝时通过引用而不是值复制。

var arr = [1, 2, 3];
var arrCopy = [];
for (i = 0; i < arr.length; i++) {
  arrCopy[i] = arr[i];
}

while()循环（浅拷贝）
和for()循环类似。

var arr = [1, 2, 3];
var arrCopy = [];
i = -1;
while (++i < arr.length) {
  arrCopy[i] = arr[i];
}

Array.map（浅拷贝）
map类似于把一个集合转换成另一个集合。使用map方法时，需要给出一个callback函数用于处理当前的数组，并返回一个新的数组元素。

var arr = [1, 2, 3];
arr.map((x) => x * 2);

map的callback函数返回原数组就可复制一个数组。

var arr = [1, 2, 3];
var arrCopy = [];
arrCopy = arr.map((x) => x );

Array.filter（浅拷贝）
Array.filter方法返回一个新数组，但是并不一定是返回同样长度的。
当过滤条件为true时，就可以用来实现拷贝。

var arr = [1, 2, 3];
var arrCopy [];
arrCopy = arr.filter(() => true);
// [1, 2, 3]

Array.reduce（浅拷贝）
reduce() 方法对数组中的每个元素执行一个reducer函数，将其结果汇总为单个返回值。

var arr = [1, 2, 3];
var arrCopy = [];
arrCopy = arr.reduce((newArray, element) => {
  newArray.push(element);
  return newArray;
}, []);

Array.slice（浅拷贝）
slice 方法常用于截取数组。根据我们指定的start、end的index从原数组中返回一个浅拷贝的数组。

[1, 2, 3, 4, 5].slice(0, 3);
// [1, 2, 3]

当不给定参数时，就返回了原数组的拷贝

var arr = [1, 2, 3, 4, 5];
var arrCopy [];
arrCopy = arr.slice();
// [1, 2, 3, 4, 5]

JSON.parse & JSON.stringify结合使用（深拷贝）
JSON.stringify将一个对象转成字符串；
JSON.parse将转成的字符串转回对象。

var arr = [[1],[2]];
var arrCopy = [];
arrCopy = JSON.parse(
  JSON.stringify(arr)
);
arrCopy[0].push(3);
console.log(arr, arrCopy);
// [[1], [2]]
// [[1, 3], [2]]

Array.cancat（浅拷贝）
concat将数组与值或其他数组进行组合。

[1, 2, 3].concat(4); // [1, 2, 3, 4]
[1, 2, 3].concat([4, 5]); // [1, 2, 3, 4, 5]

不指定参数或者提供一个空数组作为参数就可拷贝数组。

[1, 2, 3].concat(); // [1, 2, 3]
[1, 2, 3].concat([]); // [1, 2, 3]

Array.from（浅拷贝）

var arr = [1, 2, 3];
var arrCopy = [];
arrCopy = Array.from(arr);
// [1, 2, 3]