将数组中的所有对象项与 JavaScript 中的动态属性相加答案

【问题标题】：Sum all object items in array with dynamic property in JavaScript将数组中的所有对象项与 JavaScript 中的动态属性相加
【发布时间】：2021-07-05 03:49:07
【问题描述】：

我有以下数组：

[
     {category: 'Category 1', 'Apr 2021' : 10, 'Mar 2021' : 20, 'Feb 2021': 5},
     {category: 'Category 2', 'Apr 2021' : 8, 'Mar 2021' : 2, 'Feb 2021': 15},
     {category: 'Category 3', 'Apr 2021' : 7, 'Mar 2021' : 1, 'Feb 2021': 5}
]

我想添加一个包含数组中类别总和的总行。

例子：

[
     {category: 'Category 1', 'Apr 2021' : 10, 'Mar 2021' : 20, 'Feb 2021': 5},
     {category: 'Category 2', 'Apr 2021' : 8, 'Mar 2021' : 2, 'Feb 2021': 15},
     {category: 'Category 3', 'Apr 2021' : 7, 'Mar 2021' : 1, 'Feb 2021': 5},
     {category: 'Total',      'Apr 2021' : 25, 'Mar 2021' : 23, 'Feb 2021': 30}
]

我尝试使用Object.keys 遍历所有列。但是，感觉可能有更简单的方法可以实现这一点。

计算总行数的最佳方法是什么？

请注意，“2021 年 4 月”、“2021 年 3 月”不是固定的，因此我无法对它们进行硬编码。

【问题讨论】：

您好，这行得通吗？ stackoverflow.com/questions/23247859/…
这能回答你的问题吗？ Better way to sum a property value in an array
@mertdökümcü 是的，这也是我发的文章

标签： javascript arrays dynamic

【解决方案1】：

请注意，“2021 年 4 月”、“2021 年 3 月”不是固定的，所以我不会能够对它们进行硬编码。

在您的情况下，属性是动态的。您可以通过 2 个步骤尝试这种方式：

使用Array#reduce循环数组的所有对象
在每个 object 处，由于像这样的动态属性，您通过迭代 object 对每个属性的值求和

for(const [key, value] of Object.entries(curr)

const array = [
     {category: 'Category 1', 'Apr 2021' : 10, 'Mar 2021' : 20, 'Feb 2021': 5},
     {category: 'Category 2', 'Apr 2021' : 8, 'Mar 2021' : 2, 'Feb 2021': 15},
     {category: 'Category 3', 'Apr 2021' : 7, 'Mar 2021' : 1, 'Feb 2021': 5}
];
const total = array.reduce((acc, curr) => {
  for(const [key, value] of Object.entries(curr)){
    if (key !== 'category') {
      acc[key] ??= 0;
      acc[key] += value;
    }
  }
  
  return acc;
}, {});
console.log([...array, {category: "Total", ...total}]);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

我刚刚更新了动态代码，请看@developer
@developer 我刚刚编辑了问题的标题以使其更清晰。如果需要，请检查并更正。

【解决方案2】：

const data = [
     {category: 'Category 1', 'Apr 2021' : 10, 'Mar 2021' : 20, 'Feb 2021': 5},
     {category: 'Category 2', 'Apr 2021' : 8, 'Mar 2021' : 2, 'Feb 2021': 15},
     {category: 'Category 3', 'Apr 2021' : 7, 'Mar 2021' : 1, 'Feb 2021': 5}
];
const res = data.reduce((result, item) => {
  const keys = Object.keys(item);
  keys.forEach(key => {
    if (key === 'category') { return; }
    result[key] = result[key] ? result[key] + item[key] : item[key];
  });
  return result;
}, { category: 'Total' });
data.push(res);
console.log(data);

【讨论】：

【解决方案3】：

干净的声明方式：

const input = [
     {category: 'Category 1', 'Apr 2021' : 10, 'Mar 2021' : 20, 'Feb 2021': 5},
     {category: 'Category 2', 'Apr 2021' : 8, 'Mar 2021' : 2, 'Feb 2021': 15},
     {category: 'Category 3', 'Apr 2021' : 7, 'Mar 2021' : 1, 'Feb 2021': 5}
]

const totalRow = input.reduce((acc, e) => {
    Object.keys(e)
      .filter(k => k !== 'category')
      .forEach(k => acc[k] ? acc[k] += e[k] : acc[k] = e[k])
    return acc
}, {category: 'Total'})

const res = [...input, totalRow]
console.log(res)

【讨论】：