如何移除数组中同id的多项并保留一项且累加其qty值？

嘿，这个需求其实挺常见的，咱们用JavaScript的Array.prototype.reduce()方法就能轻松搞定，它天生就适合这种分组累加的场景。

直接上可运行的代码：

const arr = [ 
  { price: 12, desc: 'desc', id: 123, qty: 1 }, 
  { price: 12, desc: 'desc', id: 123, qty: 1 }, 
  { price: 12, desc: 'desc', id: 123, qty: 1 } 
];

// 第一步：用reduce按ID分组并累加数量
const groupedItems = arr.reduce((accumulator, currentItem) => {
  // 检查当前ID是否已经在分组对象中存在
  if (accumulator[currentItem.id]) {
    // 存在则累加数量
    accumulator[currentItem.id].qty += currentItem.qty;
  } else {
    // 不存在则克隆当前元素存入（避免修改原数组元素）
    accumulator[currentItem.id] = { ...currentItem };
  }
  return accumulator;
}, {});

// 第二步：将分组对象转换为目标数组
const result = Object.values(groupedItems);

console.log(result);
// 输出：[ { price: 12, desc: 'desc', id: 123, qty: 3 } ]

简单解释下逻辑： #

• 用reduce构建一个以ID为键的临时对象，把相同ID的元素聚合在一起：遇到重复ID就累加qty，首次遇到则把元素浅拷贝进去（用扩展运算符...是为了避免修改原数组的原始元素）。
• 最后通过Object.values()把临时对象的取值提取出来，转成数组就是我们要的结果。

这个方法还能兼容多ID场景——如果你的数组里同时有ID为123、456的元素，它会自动分别合并每组，灵活性拉满。要是你的元素里有嵌套对象，担心浅拷贝不够用，换成structuredClone()做深拷贝就行，不过示例这种简单结构用浅拷贝完全足够。

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