ES6如何过滤嵌套数组提取状态为Existing的listImages对应id

问题原因 #

你当前编写的代码使用map遍历lists数组返回改造后的父级对象集合，仅对每个对象的listImages字段做了过滤，最终得到的是修改后的父层级数组，无法直接提取到目标id集合。

解决代码 #

可以通过flatMap先将嵌套的listImages数组合并为一维数组，再做筛选和id提取即可：

const result = lists
  // 把所有list下的listImages数组合并为一维数组，兼容listImages为undefined的情况
  .flatMap(list => list.listImages ?? [])
  // 筛选status为Existing的图片条目
  .filter(image => image.status === 'Existing')
  // 提取对应条目的id
  .map(image => image.id);

运行后result的值即为你预期的["111"]。

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