JavaScript - 有没有一种简单的方法来获取嵌套 JSON 中每次出现的特定键的值

Posted 2023-02-22

【中文标题】JavaScript - 有没有一种简单的方法来获取嵌套 JSON 中每次出现的特定键的值

【英文标题】：JavaScript - Is there a simple way to get the values for every occurrence of a specific key in nested JSON

【发布时间】：2019-01-20 21:09:07

【问题描述】：

我有一个类似这样的 JSON 结构：

[
  
    cells: [
      id: "1", cellType: 3, widget:  id: 1, description: "myDesc" ,
      id: "2", cellType: 4, widget:  id: 2, description: "myDesc2" 
    ]
  ,
  
    cells: [
       id: "3", cellType: 5, widget:  id: 3, description: "myDesc3" 
    ]
  ,
  ...
]

如何在不使用库（包括 JQuery）的情况下，使用 EcmaScript（或 Angular 2+ 中可用的任何东西）将每个 widget 的值放入一个单独的数组中？我需要一个像这样的最终数组：

[
  
    id: 1,
    description: "myDesc"
  ,
  
    id: 2,
    description: "myDesc2"
  ,
  ... 
]

更新

（感谢@Felix Kling 的第一部分）- 我发现我可以通过以下方式获取所有小部件：

JSON.parse(json)[0].forEach( c => c.cells.forEach( c2 => console.log(c2.widget)));

【问题讨论】：

[].concat(...JSON.parse(json).map(obj => obj.cells.map(cell => cell.widget))).

myDesc3 不会成为该数组的一部分？

对不起@void 我已经澄清了这个问题 - 所有小部件对象都应该是最终数组的一部分

虽然reduce有更简洁的方法，但你不能只写嵌套循环吗？

【参考方案1】：

您可以将.map() 与.reduce() 一起使用

let input = [
  
    cells: [
      id: "1", cellType: 3, widget:  id: 1, description: "myDesc" ,
      id: "1", cellType: 4, widget:  id: 2, description: "myDesc2" 
    ]
  ,
  
    cells: [
       id: "3", cellType: 5, widget:  id: 3, description: "myDesc3" 
    ]
  ,
];

let result = input.reduce((result, current) => 
  return result.concat(current.cells.map(x => x.widget));
, [])

console.log(result);

【参考方案2】：

您可以使用.map() 和.concat() 来获得想要的结果：

let data = [
  cells: [
     id: "1", cellType: 3, widget:  id: 1, description: "myDesc" ,
     id: "1", cellType: 4, widget:  id: 2, description: "myDesc2" 
  ], 
  cells: [
       id: "3", cellType: 5, widget:  id: 3, description: "myDesc3" 
  ]
];

let result = [].concat(...data.map((cells) => cells.map((widget) => widget)));

console.log(result);

.as-console-wrapper  max-height: 100% !important; top: 0;