javascript for循环并放入一个新数组[重复]答案

【问题标题】：javascript for loop and put into a new array [duplicate]javascript for循环并放入一个新数组[重复]
【发布时间】：2017-05-12 01:31:52
【问题描述】：

这是我的代码：

let testp = {
  value: ''
}
let data = [];
for (let i = 0; i < 5; i++) {
  testp.value = i;
  data.push(testp);
}

console.log(data)

返回的数据是：

[ { value: 4 },
  { value: 4 },
  { value: 4 },
  { value: 4 },
  { value: 4 } ]

为什么？我认为结果是这样的：

[ { value: 0 },
  { value: 1 },
  { value: 2 },
  { value: 3 },
  { value: 4 } ]

【问题讨论】：

在循环内分配 testp.value 导致了问题
testp 是对 javascript 对象的引用；当您调用data.push(testp) 时，您只是向数组中添加了对同一对象的另一个引用。不是对象当前状态的副本
每个值都会得到4，因为 JavaScript 通过引用而不是值传递对象。因此，您在循环的每次迭代中修改同一个对象，而不是不同的对象。
@fubar——嗯，它实际上总是按值，只是对于对象（或non-primitives），变量所持有的值是一个引用。
可能是javascript assignment operator array的副本。

标签： javascript

【解决方案1】：

您将对对象 testp 的引用推送到数组中 5 次，每次都编辑 value 的值。

这是另一个例子：

let foo = { 'a': 1 };
let bar = [foo, foo, foo];
foo.a = 2;
console.log(foo[2]);
// 2

数组bar 包含三个对foo 的引用。更改对象的内容将更改对象所引用的任何位置的内容。

如果你想要新的对象，你必须在某个地方创建它们。例如：

// Function that constructs the new objects
let foo = (value) => { return { "value": value } };
let data = [];

for (let i = 0; i < 5; i++) {
   data.push(foo(i));
}

【讨论】：

【解决方案2】：

在循环内分配 testp.value 会导致问题。相反，您可以这样做

let testp = {
  value: ''
}
let data = [];
for (let i = 0; i < 5; i++) {
  data.push({
    value: i
  });
}

console.log(data)

【讨论】：

您能解释一下为什么在循环内部分配会导致问题吗？