如何将对象添加至JavaScript空数组中 附代码及期望输出参考

实现方法 #

方法1：直接初始化数组

如果提前知晓所有对象内容，直接用数组字面量声明即可，和你预期的输出完全一致：

var myArray = [{
    fruit: 'apple',
    price: '90',
    qty: '6'
  },
  {
    fruit: 'mango',
    price: '100',
    qty: '6'
  },
  {
    fruit: 'pineapple',
    price: '50',
    qty: '1'
  }
];

方法2：动态向空数组添加对象

如果需要逐步插入对象，调用数组的push()方法即可：

// 先声明空数组
var myArray = [];

// 逐个插入新对象
myArray.push({
  fruit: 'apple',
  price: '90',
  qty: '6'
});
myArray.push({
  fruit: 'mango',
  price: '100',
  qty: '6'
});
myArray.push({
  fruit: 'pineapple',
  price: '50',
  qty: '1'
});

常见避坑提示

对象属于引用类型，不要重复修改同一个对象的属性后多次插入数组，否则会导致数组内所有引用该对象的元素同步变为最后一次修改的值，错误示例如下：

// 错误写法
var myArray = [];
var item = {};
item.fruit = 'apple';
item.price = '90';
item.qty = '6';
myArray.push(item);

// 修改同一个对象，会导致之前插入的元素也同步变更
item.fruit = 'mango';
item.price = '100';
item.qty = '6';
myArray.push(item); // 此时数组内两个元素都是mango的相关属性

内容的提问来源于stack exchange，提问作者Sanket Jagadale