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

Question

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 推入 nestedArr 5 次，每次推入都应该在 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。知道为什么吗？

Answer 1

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

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

Answer 2

您忘记正确附加到 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]);

之前做了一个数组

Answer 3

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

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

console.log(nestedArr);

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

Nested Arrays - updating subarrays while nesting with a for loop doesn't work?

javascript

arrays

for-loop

multidimensional-array

sub-array