如何在JavaScript中将对象添加到对象数组

Question

我有这个对象

chartData = {
  datasets: []
};

它旨在存储Chart.js的数据集。 我使用以下代码从表单输入构建数据集：

formData[index].value.forEach(function (value, dataset_index) {
      let data = {};
      data[formData[index].name] = value;
      chartData.datasets[dataset_index] = data;
});

我希望chartData.datasets具有以下结构：

datasets: [{
      label: 'apples',
      data: [12, 19, 3, 17, 6, 3, 7],
      backgroundColor: "rgba(153,255,51,0.4)"
    }, {
      label: 'oranges',
      data: [2, 29, 5, 5, 2, 3, 10],
      backgroundColor: "rgba(255,153,0,0.4)"
    }]

使用调试器，我看到那条线

"chartData.datasets[dataset_index] = data;"

第一次循环迭代后，覆盖chartData.datasets[dataset_index]的值。

因此，我认为“我需要将“数据”推送到数组对象上”。 错误。 当我尝试

chartData.datasets[dataset_index].push(data);

我懂了

TypeError：chartData.datasets [dataset_index]未定义

有人知道将“数据”对象添加到chartData.datasets数组的正确方法是什么吗？ 我尝试了所有表示法的排列都无济于事。 我假设Array方法对我不可用，因为chartData.datasets[dataset_index]是一个对象？ 搜索结果被证明是徒劳的。

更新：是的，我曾想过，但是没有用。 然后，您将获得带有四个数组元素的chartData.datasets。 我只需要两个元素。 请参阅问题中的数据结构。 在按照您的建议进行操作后，我还有调试控制台的快照。 如您所见，这与我想要的数据结构不同。

更新II：这是表单输入的序列化数组的快照： 希望这可以帮助。

更新III：这是formData [index] .value快照

Answer 1

您需要将数据推送到datasets数组中：

chartData.datasets.push(data)

根据我对您在此处描述的内容的理解，这是一个解决方案：

formData[index].value.forEach(function(value, dataset_index) {
  let data = {};
  data[formData[index].name] = value;
  chartData.datasets[dataset_index] = Object.assign(chartData.datasets[dataset_index] || {}, data);
});

希望这对您有用！