You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

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

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.28 18:24:35