如何在嵌套数组对象中匹配listId与subListId后新增对应属性？

实现思路 #

先把原始接口返回的main数组预处理成查找映射表，避免嵌套循环遍历，提升效率同时简化代码逻辑：

• 构建一个以listId为键的Map，值存储对应listName，以及该list下以subList.id为键、subListName为值的子映射表
• 直接遍历folders数组，通过映射表直接取值填充属性即可

完整代码 #

// 1. 预处理main生成查找映射表
const listMap = new Map()
main.forEach(folder => {
  folder.list.forEach(listItem => {
    const subListMap = new Map(
      listItem.subList.map(sub => [sub.id, sub.subListName])
    )
    listMap.set(listItem.listId, {
      listName: listItem.listName,
      subListMap
    })
  })
})

// 2. 处理folders生成最终结构
const final = folders.map(folder => ({
  ...folder,
  list: folder.list.map(item => {
    const listInfo = listMap.get(item.listId)
    return {
      ...item,
      listName: listInfo?.listName ?? '',
      subListName: listInfo?.subListMap.get(item.subListId) ?? ''
    }
  })
}))

说明 #

• 代码中?? ''是匹配不到ID时的默认值兜底，你可以根据实际需求调整为其他默认值或者抛出匹配失败提示
• 相比多层嵌套循环，该方案时间复杂度更低：预处理仅需遍历一次main的所有节点，后续处理folders时查找属性均为O(1)复杂度
• 你的示例中folders里Folder 2的第二个subListId:3属于笔误，按你期望的结果调整为subListId:2即可正常匹配到对应名称

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