JavaScript如何基于嵌套itemId过滤两个数组生成分类商品列表

你当前的问题根源是过滤逻辑仅判断了category.itemId的第一个元素，改用Array.includes()方法判断商品Id是否存在于itemId数组即可完成全量匹配，基础实现代码如下：

const result = categories.map(category => {
  // 过滤出所有归属当前分类的商品
  const categoryItems = items.filter(item => category.itemId.includes(item.Id))
  return {
    name: category.menuItemCateName,
    items: categoryItems
  }
})

如果你的items数组数据量较大，还可以提前构建Id到商品的映射表优化查询性能，避免每次遍历全量items数组：

// 提前构建Id映射，查询时间复杂度降为O(1)
const itemMap = new Map(items.map(item => [item.Id, item]))
const result = categories.map(category => {
  return {
    name: category.menuItemCateName,
    // 直接从映射表取对应Id的商品
    items: category.itemId.map(id => itemMap.get(id))
  }
})

你原有代码中还存在map方法使用不当的问题：map是用来生成新数组的方法，如果你只是需要遍历执行逻辑应该用forEach，直接用map生成最终结果数组是更符合函数式编程习惯的写法，不需要额外声明空数组执行push操作。

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