奇怪的JavaScript阵列同步技巧？

Question

我发现了一个奇怪的JS行为：

var myArray = [ [1] , [2] , [3] ]; 

var myArrayCopy = []; 

myArrayCopy.push(myArray[1]); 

alert(myArrayCopy); // 2, as expected. 

myArrayCopy[0][0] = 'foo'; 

alert(myArrayCopy); // 'foo', as expected. 

alert(myArray); // 1, foo, 3 = WTF ? :) 

见Demo。

请注意，如果我们直接使用值而不是数组，则这不起作用。

对我来说，它看起来像将数组推到数组中，翻译成某种方式，就好像我们只推送那些数组的引用，而不是副本，（这不是人们所期待的行为，如果我错了，请更正） 。

有人可以解释为什么吗？

Answer 1

别名。

您在myArrayCopy中引用了一个对myArray中包含的存在对象（数组）的引用。因此，当您修改该数组时，您正在修改从上述数组中引用的实际对象。

请注意，当您在JavaScript中传递对象时，它们不会被复制，而是传递给实例的引用并在接收器的范围内修改它将导致修改后的对象位于来电者也是如此。 这条规则有一些明显的例外（作为原始类型的示例，它们不是对象，或者是在写入时实际复制的字符串等等），但让我们专注于您的问题。

考虑到一个数组是一个对象，它发生在下面的例子一样，但它是从我的观点更加清晰：

var o = { "foo": " bar" }; 
myArray[0] = o; 
myArrayCopy[0] = myArray[0]; 
o.foo = "nolongerbar"; 

是什么返回myArrayCopy[0].foo？什么myArray[0].foo？

在大多数OO语言中称为别名，无论如何，这是处理对象引用时的常见错误。

编辑

哦，这不是在任何情况下同步的把戏，它通常是恼人的bug背后的原因。 :-)

Answer 2

myArray[1]的值是一个数组（[2]）。当您将其推入myArrayCopy.push(myArray[1]);中的myArrayCopy时，您将按数组，而不是它的内容（[2]而不是2）。

当你稍后改变这个数组（myArrayCopy[0][0] = 'foo';）时，它在使用这个数组的任何地方显然都有效果。

Answer 3

是的，这是有道理的行动，因为myArray 1和myArrayCopy [0]具有相同的内存地址。您可以检查以下调试捕捉

通过线9号之后，那些已经在同一时间myArray的改变，myArraycopy的价值，是“富”

Answer 4

这是完全正确的。

由于数组作为对象，它存储内存地址 而不是存储值本身。

var myArray = [ [1] , [2] , [3] ]; 

myArray将存储创建的数组的地址（比如addr-1）。

由于阵列中的元素本身是一个阵列，它现在将具有对应于阵列[1]，[2]三个地址，分别[3]说addr-2，addr-3，addr-4。

所以最后我们：

addr-1 = [addr-2,addr-3,addr-4] 

---

var myArrayCopy = []; 

这将存储一个新的地址，说addr-5 = []：

myArrayCopy.push(myArray[1]); 

，因为你推的myArray的第一个元素myArrayCopy。它将存储地址addr-3。这样addr-5 = [addr-3]：

`alert(myArrayCopy); // 2, as expected 

所以当然这工作正常为addr-3 = [2]：

myArrayCopy[0][0] = 'foo'; 

这里要修改的myArrayCopy零个元素的零个元素的值，即你在addr-3改变的第一要素到foo

alert(myArrayCopy); // 'foo', as expected 

所以它的工作原理，以及：

alert(myArray); // 1, foo, 3 

myArray现在有addr-1 = [addr-2, addr-3, addr-4]，其中addr-2 = [1] ，addr-3 = ["foo"]和addr-4 = [3]。