使用 Array 构造函数创建的嵌套数组 - 参考问题 [重复]答案

【问题标题】：nested array created with Array constructor - reference issue [duplicate]使用 Array 构造函数创建的嵌套数组 - 参考问题 [重复]
【发布时间】：2018-01-21 19:06:23
【问题描述】：

我需要创建一个数组数组。每个嵌套数组都应该用零填充。我试过这个：

let test = Array
  .from(
    new Array(8)
      .fill(
        new Array(8).fill(0)
      )
  );

但后来我遇到了参考问题。例如，如果我这样做：
test[1][2] = 1;
那么每个嵌套数组在索引2处都有值1:
console.log(test[2][2]) // 1

我想出了使用循环的简单解决方案：

const testArray = new Array(8);

for (let i = 0; i < testArray.length; i++) {
  testArray[i] = new Array(8).fill(0);
}

现在它可以工作了，参考没有问题。但我不明白为什么第一次尝试会出现这个问题。谁能这么好心给我解释一下？

【问题讨论】：

标签： javascript arrays

【解决方案1】：

您用 8 个对 single 数组的相同引用填充数组，而不是对 8 个单独数组的 8 个不同引用。 fill 为它填充的数组中的每个条目重复使用相同的值，所以你得到这个：

+−−−−−−−−−−−−−−+ | (数组) | +−−−−−−−−−−−−−+ +−−−−−−−−−−−+ | 0: Ref2215 |−−−−−−−−−+−+−+−+−+−+−+−−−−−>| (数组) | | 1: Ref2215 |−−−−−−−/ / / / / / / +−−−−−−−−−+ | 2: Ref2215 |−−−−−−−−/ / / / / / | 0:0 | | 3: Ref2215 |−−−−−−−−−/ / / / / | 1:0 | | 4: Ref2215 |−−−−−−−−−−/ / / / | 2：0 | | 5: Ref2215 |−−−−−−−−−−−/ / / | ... | | 6: Ref2215 |−−−−−−−−−−−−/ / +−−−−−−−−−−+ | 7: Ref2215 |−−−−−−−−−−−−−−+ +−−−−−−−−−−−−−−+

不管你使用哪个数组槽，它们都包含对同一个数组的引用。

您的第二个代码块创建单独的数组（我不会打扰图表 :-)）。这是一个稍微短一点的方法：

let test = Array.from(
                Array(8),
                () => new Array(8).fill(0) // Mapping callback creates
           );                              // new array for every entry
                                           // in the outer array

【讨论】：

就是这样。我刚刚在 MDN 文档上找到了这个：“当填充方法被传递一个对象时，它将复制传递的对象，并用对副本的引用填充数组”。谢谢你。
@MateuszWitkowski：哎呀，我们应该解决这个问题。 fill 绝对不会“复制对象”。
您是如何如此迅速地创建该图表的？
vim 的速度相当快。
谢谢@T.J.Crowder 很抱歉这个问题被标记为重复（我不会费心反驳它）。尤其是 IMO，您的答案比我应该重复的问题中的答案更冗长和信息丰富。

【解决方案2】：

原因是第二个new Array(8).fill(0)被父Array()的所有单元格引用。您只创建一次！

相反，在您的第二次尝试中，您创建了 8 次。

【讨论】：