forEach与map嵌套执行返回undefined问题排查（购物车逻辑）

• 已实现套餐商品系统，单个套餐支持绑定多个商品
• 用户购买套餐时，套餐会被加入购物车
• 重复购买同一款套餐时的校验逻辑：先匹配套餐ID，再逐一匹配套餐内商品的尺寸、颜色属性，所有属性完全匹配时，对应商品的购买数量加1

代码执行后始终返回undefined：所有判断分支内添加的console.log均可正常打印输出，获取到的变量值也符合预期，但无法返回正确的购物车更新结果。
相关实现代码如下：

action.payload.packet?.products.forEach((product => {
  return state.cart.map((el => {
    if(el.packet?.id === action.payload.packet?.id) {
      return {
        ...el,
        product: el.packet?.products.map((state_p => {
          if(product.id === state_p.id) {
            return {
              ...state_p,
              selectedOption: state_p.selectedOption.map((so => {
                if(so.color === product.selectedOption[0].color && so.size === product.selectedOption[0].size) {
                  console.log('HII333')
                  return {
                    ...so,
                    amount: so.amount + 1
                  }
                } else {
                  return {
                    ...so
                  }
                }
              }))
            }
          } else {
            return {
              ...state_p
            }
          }
        }))
      }
    } else {
      return {
        ...el
      }
    }
  }));
}));

问题确实由return逻辑错误导致，共有两处核心问题：

1. 最外层错误使用forEach做遍历：forEach方法本身没有返回值，回调函数内的return只会结束当前次遍历，不会把内层map生成的结果作为整个函数的返回值抛出，这是函数最终返回undefined的核心原因。
2. 内层商品遍历的分支存在return遗漏：在el.packet?.products.map的回调中，仅处理了product.id === state_p.id成立时的返回逻辑，当条件不成立时没有写return语句，该分支会默认返回undefined，会导致最终生成的商品列表出现空项。

• 把最外层的forEach替换为reduce，遍历待加购套餐的所有商品时，逐次迭代更新购物车状态，最终返回迭代完成的完整购物车结果
• 补全内层map遍历所有分支的return语句，避免出现空值

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