使用For循环将Javascript对象压入数组

Question

Hi I am trying push a javascript object inside an array in javascript using a for loop to iterate through the data. Here is how my code looks like.

var data = {"up": [{
  "name": "jack",
  "age" : 10
},
 {
   "name" : "jhon",
   "age" : 12
  }]};

var output = {};
var output_data = {
  element: []
};

for (var key in data.up) {
  output.user_name = data.up[key].name;
  output_data.element.push(output);
}

console.log(output_data.element);

However as you can see in the example http://jsbin.com/fanazaxoda/edit?html,js,console only the second element is name 'jhon' is inserted in both occations. What am I doing wrong here? Please explain.

Answer 1

Move the output initialization inside for loop otherwise it push reference of object each time. Updating it's property may reflect in all array elements since all elements are referring the same object.

var output_data = {
  element: []
};

for (var key in data.up) {  
  var output = {}; // create new empty object on each iteration
  output.user_name = data.up[key].name;
  output_data.element.push(output);
}

 var data = { "up": [{ "name": "jack", "age": 10 }, { "name": "jhon", "age": 12 }] }; var output_data = { element: [] }; for (var key in data.up) { var output = {}; output.user_name = data.up[key].name; output_data.element.push(output); } console.log(output_data.element);