使用Array.reduce处理多分类产品列表时出现Cannot read property of undefined错误的求助

嘿，我看到你的问题啦！咱们来一步步找出问题所在，帮你把代码修好～

错误原因分析 #

你的代码主要有两个关键问题导致了报错：

1. 内层reduce的初始值错误
   你给处理分类数组的内层reduce传的初始值是0，但我们需要操作的是外层reduce的累积对象prev。初始值设成数字0后，第一次内层循环时，prevTyp会是0，这时候尝试访问prev[currTyp]（其实这里的prev是内层reduce的累积值0），数字类型根本没有属性，自然会抛出「Cannot read property of undefined」的错误。

2. 数组分支未返回外层累积对象
   在处理typ为数组的分支里，你写完内层reduce后没有在外层的if分支里返回prev，这会导致外层reduce的累积值变成undefined，后续的迭代就会彻底混乱。

修正后的代码 #

我把代码重构了一下，不仅修复了错误，还简化了逻辑：

const listaZakupow = [
  { produkt: "chleb", typ: "pieczywo", ilosc: 2, cena: 3.6, jednostka: "sztuk" },
  { produkt: "jabłka", typ: ["owoce", "slodkie"], ilosc: 6, cena: 2.5, jednostka: "kg" },
  { produkt: "mleko", typ: ["nabiał", "bialko"], ilosc: 3, cena: 2.9, jednostka: "litry" }
];

const produkty = listaZakupow.reduce((prev, curr) => {
  // 统一把typ转成数组：不管是字符串还是数组，都用数组遍历
  const typy = Array.isArray(curr.typ) ? curr.typ : [curr.typ];
  
  typy.forEach(typ => {
    // 分类不存在就初始化空数组
    if (!prev[typ]) {
      prev[typ] = [];
    }
    prev[typ].push({ produkt: curr.produkt, ilosc: curr.ilosc });
  });
  
  // 必须返回外层的累积对象，保证reduce迭代正常
  return prev;
}, {});

console.log(produkty);

优化说明 #

• 统一处理分类类型：不管typ是字符串还是数组，都转成数组来遍历，避免写重复的分支代码，逻辑更清晰。
• 用forEach替代内层reduce：这里只是遍历分类数组做添加操作，不需要返回新的累积值，forEach比嵌套reduce更直观，也避免了初始值的坑。
• 确保每次返回累积对象：不管处理哪种类型的typ，最后都返回prev，这是reduce正常工作的核心要求。
• 简化判断逻辑：用!prev[typ]代替prev[typ] === undefined，效果一致但代码更简洁。

至于之前处理书籍列表时能正常运行，大概率是当时的代码在嵌套reduce的初始值、返回值上没有犯这些错误，或者书籍的typ结构更单一，刚好避开了这些问题～

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