JavaScript中spread运算符在copyMachine习题中的作用是什么？

核心差异：引用和真实拷贝的区别 #

JS中数组是引用类型，直接push(arr)本质上是把原数组的内存地址引用添加到newArr里，并没有生成新的数组副本。你现在看到输出结果相同，只是因为你没有修改原数组的值，一旦修改原数组，所有push进去的元素都会同步变化，完全不符合题目要求的「拷贝arr」的规则。

举个实际测试的例子就能看出区别：

// 用push(arr)的错误写法
function badCopyMachine(arr, num) {
  let newArr = [];
  while (num >= 1) {
    newArr.push(arr);
    num--;
  }
  return newArr;
}

const originArr = [true, false, true];
const result = badCopyMachine(originArr, 2);
originArr[0] = "我被改了";
console.log(result); 
// 输出会变成：[ [ '我被改了', false, true ], [ '我被改了', false, true ] ]
// 所有子数组都跟着原数组变了，根本没有实现拷贝效果

而用[...arr]的写法，是通过展开运算符生成一个全新的数组副本，和原数组完全脱离引用关系，修改原数组不会影响到newArr里的子数组，这才是符合题目要求的拷贝实现：

const originArr = [true, false, true];
const result = copyMachine(originArr, 2);
originArr[0] = "我被改了";
console.log(result); 
// 输出还是：[ [ true, false, true ], [ true, false, true ] ]
// 拷贝出来的数组不受原数组修改的影响，符合需求

另外这道题本身的考点就是考察展开运算符做数组拷贝的用法，所以要求你用[...arr]的写法实现。

内容的提问来源于stack exchange，提问作者Tatjana Platonova