为何修改stringList2会影响stringList1？数组赋值问题咨询

代码复现 #

var stringList1=[
  'value1',
  'value2',
  'value3',
  'value4',
];
var stringList2=stringList1;
stringList2.remove("value3");

错误原因 #

JavaScript里数组属于引用类型，直接用=赋值时，并没有复制数组的实际内容，只是把stringList1指向数组的内存地址传给了stringList2。这意味着两个变量共享同一个数组实例，操作任何一个变量都会直接修改内存里的原数组，所以删stringList2的值时，stringList1也会跟着变。

解决方法（浅拷贝，适用于当前字符串数组场景） #

以下几种方法都能创建原数组的独立副本，修改新数组不会影响原数组：

• 扩展运算符（ES6+）：最简洁的写法

  var stringList2 = [...stringList1];
  

• slice()方法：不传参数时返回原数组的浅拷贝

  var stringList2 = stringList1.slice();
  

• Array.from()方法：专门用于从类数组或可迭代对象创建新数组

  var stringList2 = Array.from(stringList1);
  

• concat()方法：通过合并空数组与原数组生成新数组

  var stringList2 = [].concat(stringList1);
  

注意：如果数组包含对象、嵌套数组等复杂类型，以上方法都是浅拷贝（只复制外层引用），若需要完全独立的深拷贝，得用JSON序列化或递归拷贝，但你的场景是字符串数组，以上方法足够。

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