Question

我遇到此代码的问题：

var openingSegments = Array(7).fill([]);
openingSegments[0].push({'start': '1100', 'end': '1900'});

因为当我这样做时：

console.log(openingSegments);

它给了我：

[ [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ],
  [ { start: '1100', end: '1900' } ] ]

好像我已经把所有元素都推到了“小时候”。但事实并非如此，因为我只对第一个元素（索引0）应用了push。

这里发生了什么？

Answer 1

fill只复制所有项目中传递的参数。实际上，您只有一个数组对象，并且该对象的7引用副本被推入到数组中。通过一个引用更改数组会影响所有项目。

您可以使用Array#from函数代替fill而不是mapFn参数。

var openingSegments = Array.from({ length: 7 }, x => []);
openingSegments[0].push({'start': '1100', 'end': '1900'});

console.log(openingSegments[0]);
console.log(openingSegments[1]);

Answer 2

Array.fill只用完全相同的对象填充你的数组。

这基本上就是填充方式：

function fillFunc(size, element) {
  const resultArray = [];
  for (let i = 0; i < size; ++i) {
    resultArray.push(element);
  }
  return resultArray;
}
const filledArray = fillFunc(7, []);

正如您所看到的，生成的数组只是填充了对初始对象的引用。我会根据你的特殊需求选择Array.fill（）以外的东西。

Javascript嵌套数组单元素修改转换为整个数组修改

2 个答案: