javascript - 为什么将对象插入数组会修改数组中不需要的部分？

Question

我正在尝试用对象列表填充一个数组。

  var testarray=[];
  var temp={};

  temp.data = 10;
  temp.data2= 11;
  testarray.push(temp);
  console.log("After first push:");
  console.log(testarray[0].data);
  console.log(testarray[0].data2);

  temp.data = 20;
  temp.data2 = 21;
  testarray.push(temp);
  console.log("After second push:");
  console.log(testarray[0].data);
  console.log(testarray[0].data2);
  console.log(testarray[1].data);
  console.log(testarray[1].data2);

我希望在第二次推送之后，testarray 将包含值 第一个数组元素为 10 和 11，以及 第二个为 20 和 21。

但实际上，第一个数组元素也包含 20 和 21。因此第二次推送会覆盖第一个数组元素。怎么了？

Answer 1

temp 变量保存对象引用，而您将对象引用推送两次，因此更新一个属性会更改对象属性。

var testarray = [];
var temp = {};

temp.data = 10;
temp.data2 = 11;
testarray.push(temp);
console.log("After first push:");
console.log(testarray[0].data);
console.log(testarray[0].data2);

// update with new object
temp = {};

temp.data = 20;
temp.data2 = 21;
testarray.push(temp);
console.log("After second push:");
console.log(testarray[0].data);
console.log(testarray[0].data2);
console.log(testarray[1].data);
console.log(testarray[1].data2);