如何使用原生JavaScript将嵌套JSON转换为指定格式的对象数组

参考数据 #

输入源结构 #

let Input = {
  details: [
    {
      "id": "Country_name",
      "values": ["India", "England", "Germany"]
    },
    {
      "id": "Country_capital",
      "values": ["Delhi", "London", "Berlin"]
    }
  ],
  metadata: [
    {
      "id": "Country_name",
      "label": "Country"
    },
    {
      "id": "Country_capital",
      "label": "Capital"
    }
  ]
}

预期输出结构 #

let Output = [
  {
    "Country": "India",
    "Capital": "Delhi"
  },
  {
    "Country": "England",
    "Capital": "London"
  },
  {
    "Country": "Germany",
    "Capital": "Berlin"
  }
]

原有代码的问题 #

• 变量名不匹配：定义的输入对象是大写开头的Input，遍历逻辑中引用了小写的input，运行时会直接抛出未定义错误
• 遍历逻辑偏离转换目标：原有代码仅逐层读取顶层键、打印数组元素的id字段，既没有建立metadata中字段id和输出字段名（label）的映射关系，也没有按同一索引位置拼接不同字段的取值为单条业务对象

可落地的原生JS实现（支持纯forEach写法） #

实现步骤拆解：

1. 遍历metadata数组，生成字段id到输出label的映射表，避免后续反复匹配查找
2. 取任意一个details项的values数组长度作为结果的总条数（默认所有字段的values长度对齐，和示例结构一致）
3. 逐索引遍历每一行数据，把每个details项对应索引的取值，按映射的字段名拼成单条对象，推入结果数组

// 1. 生成id到label的映射关系
const idLabelMap = {}
Input.metadata.forEach(item => {
  idLabelMap[item.id] = item.label
})

// 2. 计算结果总条数
const rowCount = Input.details[0].values.length
const result = []

// 3. 逐行拼接结果（完全使用forEach实现）
Array(rowCount).fill(null).forEach((_, rowIndex) => {
  const rowItem = {}
  Input.details.forEach(detail => {
    const fieldName = idLabelMap[detail.id]
    rowItem[fieldName] = detail.values[rowIndex]
  })
  result.push(rowItem)
})

// 运行后result和示例Output结构完全一致

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