JavaScript如何将对象数组求和合并为单行 求更简便实现方法

你原来的双重遍历写法逻辑是可行的，但可以用更语义化、可读性更好的原生数组方法重构，代码更简洁也更易维护。

可直接运行的实现代码 #

const input = [
    {id: 'id1', type: "A", active: 3},
    {id: 'id2', type: "A", active: 5},
    {id: 'id3', type: "B", active: 3},
    {id: 'id4', type: "B", active: 4},
    {id: 'id5', type: "C", active: 8},
    {id: 'id6', type: "C", active: 5},
    {id: 'id7', type: "C", active: 6},
    {id: 'id8', type: "C", active: 7},
];

const t1 = performance.now();
// 用reduce做聚合，初始化累加器为空对象
const summaryObj = input.reduce((accumulator, currentItem) => {
  // 遍历当前行的所有字段，累加到累加器对应字段
  for (const key in currentItem) {
    accumulator[key] = (accumulator[key] ?? 0) + Number(currentItem[key]);
  }
  return accumulator;
}, {});
// 按照要求把结果包裹在数组中
const output = [summaryObj];
const t2 = performance.now();

console.log('output:', output, `耗时 ${t2 - t1}ms`);

运行后输出完全匹配给出的期望结果：

[
    {id: NaN, type: NaN, active: 41}
]

写法优势 #

• 语义清晰：reduce是JS原生设计用来做数组聚合、收敛计算的方法，其他开发者看到reduce就能立刻明白这段代码是要把数组合并为单个结果，不需要跟着两层嵌套forEach跳转梳理逻辑
• 逻辑更顺畅：顺着数组单次遍历即可完成所有字段的累加，不需要先取出第一个对象的key列表，再针对每个key反复遍历整个数组求和
• 隐式逻辑更少：用Number()做类型转换比parseInt()更严谨，parseInt会对带非数字后缀的字符串（比如"3abc"）返回解析到的数字部分3，容易产生隐蔽的计算错误；Number遇到非纯数字值会直接返回NaN，NaN参与加法运算结果始终为NaN，天然符合期望输出里非数字字段返回NaN的要求，不需要额外写isNaN分支判断
• 易扩展：如果后续需要调整非数字字段的处理规则（比如原代码里给非数字字段赋值空字符串），只需要在字段累加的位置加一行判断即可，示例：

const summaryObj = input.reduce((accumulator, currentItem) => {
  for (const key in currentItem) {
    const numVal = Number(currentItem[key]);
    accumulator[key] = isNaN(numVal) ? '' : (accumulator[key] ?? 0) + numVal;
  }
  return accumulator;
}, {});

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