Javascript Grammer：如何为对象数组分配正确的值[重复]答案

【问题标题】：Javascript Grammer: how to assign correct values to an array of objects [duplicate]Javascript Grammer：如何为对象数组分配正确的值[重复]
【发布时间】：2023-03-29 04:09:01
【问题描述】：

让我们看一下代码：

  Test() {
let array1 = new Array(5).fill({ a: 0 })
let array2 = new Array(5).fill({ a: 0 })
for (let i = 0; i < 5; i++) {
  setTimeout(() => {
    array1[i].a = i
    array2[i] = {a:i}
    console.warn("array = ", array1)
    console.warn("array2 = ", array2)
  }, 0.2 * i)
}

}

在这种情况下，我想为array1和array2分配一系列值，有两种方法可以做到这一点，这会导致完全不同的结果。在array1[i].a = i的情况下，运行完所有代码后，结果是array = [{a:4},{a:4},{a:4},{a:4},{a:4}]，这不是我想要的。在第二种情况下array2[i] = {a:i}，结果将是[{a:0},{a:1},{a:2},{a:3},{a:4}]，正如预期的那样。我想知道为什么会这样？这种现象背后的机制是什么？

谢谢。

【问题讨论】：

标签： javascript

【解决方案1】：

当您调用.fill() 并传递一个对象时，您将完全相同的对象 分配给数组的每个元素。因此，修改一个数组索引处的属性会修改所有其他索引处的相同属性，因为它们都指向同一事物。

有多种方法可以解决这个问题。您可以使用0 或null 或一些虚拟值填充数组，然后使用.forEach() 进行迭代，或者更简单地使用索引for 循环来初始化每个元素。如果在for 循环中使用{ a: 0} 进行初始化，则每次迭代都会创建一个新对象。

【讨论】：

顺便说一句，这不是“语法”问题。