如何整理JavaScript对象数组？合并同containerId对象并汇总goods数组

解决方案 #

可以通过 Map 按 containerId 分组，合并对应条目下的 goods 数组，实现结构转换：

const originalData = [
  {
    containerId: 'c12',
    containerNumber: '4321dkjkfdj',
    goods: [{ weight: '32kg', quantity: '3' }]
  },
  {
    containerId: 'c12',
    containerNumber: '4321dkjkfdj',
    goods: [{ weight: '322kg', quantity: '32' }]
  },
  {
    containerId: 'c13',
    containerNumber: '1212dkjkfdj',
    goods: [{ weight: '13kg', quantity: '3' }]
  },
  {
    containerId: 'c13',
    containerNumber: '1212dkjkfdj',
    goods: [{ weight: '13kg', quantity: '3' }]
  }
];

const mergedData = Array.from(
  originalData.reduce((map, item) => {
    const key = item.containerId;
    if (!map.has(key)) {
      map.set(key, {
        ...item,
        goods: [...item.goods]
      });
    } else {
      map.get(key).goods.push(...item.goods);
    }
    return map;
  }, new Map()).values()
);

console.log(mergedData);

代码说明 #

• 分组逻辑：用 reduce 遍历原始数据，以 containerId 作为键存入 Map，确保每个容器ID只对应一个条目。
• 初始化条目：首次遇到某容器ID时，通过扩展运算符复制基础信息，并创建新的 goods 数组（避免引用原始数据）。
• 合并商品数组：后续遇到相同容器ID时，直接将当前项的商品元素追加到已有条目的 goods 数组中。
• 转换为数组：最后用 Array.from 将 Map 的值转换为数组，得到最终合并结果。

运行后输出的结构与你期望的目标完全一致。

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