嵌套数组 - 使用 for 循环嵌套时更新子数组不起作用？答案

【问题标题】：Nested Arrays - updating subarrays while nesting with a for loop doesn't work?嵌套数组 - 使用 for 循环嵌套时更新子数组不起作用？
【发布时间】：2019-05-18 14:56:15
【问题描述】：

const nestedArr = [];
// ADD CODE HERE
let arr = [];
for(let i=0; i<5; i++){
  arr.push(`loop${i}`, i);
  nestedArr.push(arr);
  // nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr)

大家好，我只是想知道一些我不理解的 JS 行为。使用灰色注释行 // nestedArr.push([loop${i}, i]); 解决了挑战，但是当我尝试使用未注释的其他方法时

arr.push(`loop${i}`, i);
nestedArr.push(arr);

不像我想的那样工作。

方法是首先声明一个数组arr，然后每5次迭代将字符串loop${i}和第二个元素索引i推送给它。接下来在 5 次迭代中将数组 arr 推入 nestedArr。预期结果应该将 arr 推送 5 次到 nestedArr 中，每次推送都应该在 arr 中一次添加一个元素。但是，正如您所见，推送的子数组 arr 都被推送了 5 个元素，每次 5 次。当 i 为 0 时，我期待第一次迭代，子数组 arr 被推送到 nestedArr 以仅包含一个元素，但已与其他子数组保持 5 相同。

[['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4]]

预期的结果应该是

[['loop0', 0], ['loop1', 1], ['loop2', 2], ['loop3', 3], ['loop4', 4]]

每次迭代时在子数组 arr 中添加一个元素，然后在 5 次迭代期间将其推送到 nestedArr。知道为什么吗？

【问题讨论】：

您正在nestedArr 内部推送arr 的引用，并将项目添加到arr。因此，结果将是一个包含 5 个 arr 引用的数组，指向内存中的同一个数组（因此是结果）。对于预期的结果，只需将 arr 声明移动 inside 循环，以便每次都重新声明它并且推送到 nestedArr 的引用将始终指向内存中的不同数组（因此5 个不同的数组）。
这是有道理的@briosheje，没想到这让我很困惑。感谢您的反馈！
不客气。作为一般规则，请记住，除了原始类型之外的所有类型都是通过引用传递的，因此数组和对象在 javascript 中总是通过引用传递。跟踪您的变量并记住即使是日志也是通过引用工作的，因此在循环时记录您的数组仍然会每次都记录相同的记录。
我知道这是一个很棒的提示！谢谢！！

标签： javascript arrays for-loop multidimensional-array sub-array

【解决方案1】：

您应该在每次循环再次开始时初始化数组arr：

const nestedArr = [];
for (let i = 0; i < 5; i++) {
  let arr = [];
  arr.push(`loop${i}`, i);
  nestedArr.push(arr);
}
console.log(nestedArr);

【讨论】：

【解决方案2】：

Array 是一个对象，因此您在最终数组 nestedArr 中推送的内容实际上包含子数组的引用（在您的情况下为 arr）。现在，由于您将数据推送到同一个子数组 arr 中，因此每次都会在主数组中更新它的引用，最后当您打印输出时，它会在数组中多次包含相同的对象。为避免这种情况，您可以使用@Oihane Vázquez 建议的内容，也可以像这样直接将数据推送到主数组中

const nestedArr = [];
for (let i = 0; i < 5; i++) {
  nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr);

【讨论】：

【解决方案3】：

您忘记正确附加到 arr：

const nestedArr = [];
// ADD CODE HERE
let arr = [];
for(let i=0; i<5; i++){
  arr.push([`loop${i}`, i]);
  nestedArr.push(arr);
  // nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr)

看我在推入 arr arr.push([loop${i}, i]);之前做了一个数组

【讨论】：