JavaScript如何提取嵌套数组对象中指定key的值为一维数组

你使用嵌套map返回二维数组的原因很简单：map方法会为原数组的每一个元素返回一个对应结果，内层map给每个外层元素返回了子id组成的数组，外层map就会把这些数组合并为二维结构。

下面是几种常见的实现方式：

方法1：flatMap（最推荐，适配当前场景） #

flatMap等价于map之后调用深度为1的flat，刚好适配你的两层嵌套结构，代码最简洁：

const subItemIDs = items.flatMap(item => 
  item.sub_items.map(subItem => subItem.id)
)

方法2：map + flat组合 #

如果已经写好了嵌套map的逻辑，直接在末尾调用flat()拉平一层即可：

const subItemIDs = items.map(item => 
  item.sub_items.map(subItem => subItem.id)
).flat()

flat()默认只拉平一层嵌套，完全匹配你的使用场景，不需要额外传参。

方法3：reduce实现（兼容旧环境） #

如果需要兼容不支持ES2019新增的flat/flatMap的旧运行环境，可以用reduce累加结果：

const subItemIDs = items.reduce((result, item) => {
  item.sub_items.forEach(subItem => result.push(subItem.id))
  return result
}, [])

以上三种方法运行后打印subItemIDs，都会得到你预期的[1, 2, 3, 4, 5, 6]结果。

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