Question

我一直在使用JavaScript很长一段时间，但从未遇到过这个问题：

var objArr = [];
var obj = {
  id:null,
  name:''
}

//Type 1: Why This do not work
    //create an array of 5 object
    for(var i=0; i<3; i++){
        obj.id = i;
        console.log(obj);
       objArr.push(obj); //What is wrong here
        }

    console.log(JSON.stringify(objArr)); // Have 5 objects in the array, But if you see this object is display the last object 
//output : [{"id":2,"name":""},{"id":2,"name":""},{"id":2,"name":""}]


//Type 2: Why This Works and why the above object works
var objArr=[];
    //create an array of 5 object
    for(var i=0; i<3; i++){
        console.log(obj);
       objArr.push({"id":i, "name":''});
        }

    console.log(JSON.stringify(objArr)); 
//output : [{"id":0,"name":""},{"id":1,"name":""},{"id":2,"name":""}]

也许我错过了解这里的物品。你能告诉我为什么会这样吗。

我有一个jsfiddle.net Fiddle

Answer 1

在第一个示例中，您有一个（仅一个）对象obj。您正在创建一个包含3个（而不是5个）对象的数组，但是数组中的每个位置都指向相同的对象。

当您设置obj.id时，您正在为唯一的对象更改它，该对象在数组中的每个位置都被引用。

在第二个示例中，您每次都在创建一个新对象：

{"id": i, "name":''}          // this creates a new object

所以它有效。

Answer 2

尝试使用以下内容：

var objArr=[];

for(var i=0; i<3; i++){
    var obj = {};
    obj['id'] = i;
    obj['name'] = null;
    console.log(obj);
   objArr.push(obj); 
    }

console.log(JSON.stringify(objArr));

Answer 3

你只需要在第一个for循环中创建一个新的obj。您只需编辑for循环外定义的当前obj。因此，每个循环将一个obj的id设置为它的值，然后您将其副本插入到数组中，因此在下一个循环中，每个对原始对象的引用都会更改。

在for循环中，我刚刚添加了＆＃39; var＆＃39;所以obj是一个新的，而不是在父范围内的那个：

var obj.id = i;

但是你可能想要重新格式化它。

不了解对象行为

3 个答案: