Question

考虑下一个代码：

var rows = [];
for (var i = 0; i < 10; i++) {
    rows.push({num:i});
    console.log(rows);
}

为什么我会看到下一个控制台输出：

[Object]
[Object, Object]
[Object, Object, Object]
[Object, Object, Object, Object]
[Object, Object, Object, Object, Object]
[Object, Object, Object, Object, Object, Object]
[Object, Object, Object, Object, Object, Object, Object]
etc ...

但是当我展开时，例如，第一个对象我看到数组中的所有10个对象，但此时我只放了第一个？所以每次迭代我看到数组中的所有10个对象

我使用chrome开发工具，但是在firebug中使用相同的图片，所以我想我的错误但无法弄清楚发生了什么

Answer 1

控制台具有对数组的引用，该数组在循环的每次迭代中都会更改。检查数组时，控制台将显示其当前状态，而不管运行实际console.log时数组的状态如何。这就是为什么在控制台中检查数组时，总是会看到数组中的所有10个对象。

Answer 2

如果console.log只存储一个对象引用，而不是该对象的副本，那么这就解释了为什么在记录它时，您会看到该对象处于最终状态。但是......我们也看到对象显示为长度为1，然后是2，......，它与数字有关，而不是对象，因此它最终看起来像一个错误，其中只有一部分对象被复制。

你可以自己修复数组的副本（使用slice（0））：

var rows = [];
for (var i = 0; i < 10; i++) {
    rows.push({num:i});
    console.log(rows.slice(0));
}

这将按您的要求逐步输出。

还要注意，因为即使使用切片，数组中的对象也不会被复制：

var rows = [];
for (var i = 0; i < 10; i++) {
  rows.push({num:i});
  if (i==3) rows[1].num = 1000;
  console.log(rows.slice(0));
}

即使对于索引0,1,2，控制台也会将行[1] .num报告为1000。

因此，如果你也可以在控制台中读取数组项之前更改数组项，那么复制是不够的，你必须去寻找数组的深层副本。

Console.log输出对象数组

2 个答案: