JavaScript如何合并相同product_id对象并累加quantity值
购物车同商品合并及数量累加实现
问题场景
现有存储多件商品的购物车数组,结构如下,同ID商品可能被多次添加:
[ { product_id: 123, price: 100, quantity: 1, item: { ... some more data } }, { product_id: 200, price: 199, quantity: 1, item: { ... some more data } }, { product_id: 123, price: 100, quantity: 2, item: { ... some more data } } ]
需要将相同product_id的重复商品合并为单个对象,核心要求是quantity字段做累加汇总,其余商品属性保留,期望输出结构:
[ { product_id: 123, price: 100, quantity: 3, // 同ID商品数量累加结果,为核心要求 item: { ... some more data } }, { product_id: 200, price: 199, quantity: 1, item: { ... some more data } } ]
当前已编写的实现代码可以完成基础对象合并,但无法实现quantity字段的累加:
const output = Object.values( items.reduce((accu, { product_id, ...item }) => { if (!accu[product_id]) accu[product_id] = {} accu[product_id] = { product_id, ...accu[product_id], ...item } return accu }, {}), )
修改方案
现有代码的问题是合并对象时直接用新条目的字段覆盖了累积值中的同名字段,没有对quantity做单独的累加处理,修改后代码如下:
const output = Object.values( items.reduce((accu, currentItem) => { const { product_id, quantity } = currentItem // 首次遇到该商品时初始化条目 if (!accu[product_id]) { accu[product_id] = { ...currentItem, quantity: 0 } } // 单独累加商品数量 accu[product_id].quantity += quantity return accu }, {}) )
逻辑说明
- 遍历商品时以
product_id作为分组唯一标识 - 第一次收录某ID商品时,将整条商品数据存入累积对象,同时把
quantity重置为0作为累加基数 - 后续遍历到同ID商品时,仅对
quantity做加法运算,其余商品属性(价格、详情等)保留首次存入的内容即可,避免无意义的重复覆盖 - 最终通过
Object.values取出分组后的所有值,就是合并完成的购物车数组
如果业务场景下同ID商品可能出现价格、详情更新的情况,只需要在累加数量的同时按需更新对应字段即可,核心的数量累加逻辑不需要改动。
内容的提问来源于stack exchange,提问作者ST80
相关产品推荐
相关产品推荐

