我正在尝试用矩形区域“绘制”一些网格。但是,当我尝试只修改一行时,数组会修改所有它们。我尝试了几种初始化数组的方法,但是问题似乎出在我尝试修改它而不是修改Array对象时。



var multiArray = Array(8).fill(Array(8).fill(false));

// Fill square 3x1 at (2, 4)
for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 1; j++) {
    multiArray[2 + i][4 + j] = true;
  }
}

document.getElementById("content").innerHTML =
  multiArray.map(a => a.map(e => e ? 'X' : '0').join(''))
    .join('<br />');

<div id="content" />





在这一点上,除了提供解决方案之外,我只想了解为什么会这样。 [][]表达式有什么问题。

我正在Chrome版本51.0中尝试此操作

最佳答案

Array(8).fill(Array(8).fill(false))仅创建两个数组,其中一个包含对另一个的八个引用。如果将它分成两行,这会更加明显-以下是等效的:

var tempArray = Array(8).fill(false);
var multiArray = Array(8).fill(tempArray);


所以这不是您想要的。尝试这样的事情:

var multiArray = Array(8).fill(0).map(_=>Array(8).fill(false));


我已经用占位符将第一个数组填充为零,以便.map()将访问所有这些元素,然后对于每个元素,我的小地图回调返回一个新数组,其中填充了false

在上下文中:



var multiArray = Array(8).fill(0).map(_=>Array(8).fill(false));

// fill square 3x1 at (2, 4)
for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 1; j++) {
    multiArray[2 + i][4 + j] = true;
  }
}

document.getElementById("content").innerHTML =
  multiArray.map(a => a.map(e => e ? 'X' : '0').join(''))
  .join('<br />');

<div id="content" />

关于javascript - 修改多数组中的所有数组,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/38849896/

10-12 00:06
查看更多