如何提取嵌套JSON数组所有name字段值并在控制台打印指定数组

问题背景 #

处理嵌套数组结构时，仅能获取顶层对象的name字段，无法提取嵌套在子属性中的name值，需要将所有层级的name字段收集为一维数组，目标输出为["Andrew","english","karthick","French"]。

待处理的源数据：

const data=[{
    "name": "Andrew",
    "age": "23",
    "subject": [{
        "name": "english",
        "period": "1st"
    }]
},
{
    "name": "karthick",
    "age": "29",
    "subject": [{
        "name": "French",
        "period": "3st"
    }]
}]

实现代码 #

方案1：通用递归实现（适配任意嵌套深度） #

该方案不限制数据嵌套层级，只要节点存在name字段就会被收集，后续数据结构新增嵌套也不需要修改逻辑：

function collectAllNames(list) {
  const nameList = []
  for (const node of list) {
    // 收集当前节点的name字段
    if (typeof node.name === 'string') nameList.push(node.name)
    // 遍历节点属性，遇到数组则递归进入下一层收集
    for (const key in node) {
      if (Array.isArray(node[key])) {
        nameList.push(...collectAllNames(node[key]))
      }
    }
  }
  return nameList
}

console.log(collectAllNames(data))
// 输出结果：["Andrew", "english", "karthick", "French"]

方案2：固定结构简化实现 #

如果确定数据只有顶层和subject两层嵌套，可以直接用flatMap拍平实现，代码更精简：

const nameList = data.flatMap(item => [
  item.name,
  ...item.subject.map(subItem => subItem.name)
])

console.log(nameList)
// 输出结果：["Andrew", "english", "karthick", "French"]

方案选择参考 #

• 递归方案通用性强，适合数据结构可能动态调整、嵌套深度不固定的场景
• 简化写法性能更高、代码更短，适合数据结构完全固定的业务场景

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