如何使用 JavaScript 解析嵌套数组中的 JSON 值

Question

我提供了一个如下所示的数组。现在我想通过循环获取“name”键的所有值。如何获得？

我试过了。但我无法得到正确的结果

dangle=  [[{name:"jack",age:"20"}],
         [{name:"ram",age:"25"}], 
         [{name:"vishy",age:"45"}]]

我期待“jack”、“ram”、“vishy”。但它显示了第一个索引值，如“jack”、“20”。下面附上我尝试过的代码。给我一个建议以获得正确的输出。谢谢

这是我的代码

for(i=0;i<dangle.length;i++)
{
   alert(dangle[i]);
}

Answer 1

您可以使用.map() 和.concat() 仅获取名称数组：

const data = [
  [{name:"jack",age:"20"}],
  [{name:"ram",age:"25"}], 
  [{name:"vishy",age:"45"}]
];

const result = [].concat(...data).map(({ name }) => name);

console.log(result);

Answer 2

有很多方法可以遍历/循环数组。使用for 循环的一种常见方式。 for 循环可以有多种变体：

• 标准for 循环（循环遍历数字，其中i 是每个数字）：

  for(let i = 0; i < dangle.length; i++) { // loop through the dangle array
    let arr = dangle[i]; // get each inner array from index `i`
    for(let j = 0; j < arr.length; j++) { // loop through the inner array
      console.log(arr[j].name); // print the name of each object
    }
  }
  

let dangle =  [[{name:"jack",age:"20"}], [{name:"ram",age:"25"}],[{name:"vishy",age:"45"}]];
        
for (let i = 0; i < dangle.length; i++) {
  let arr = dangle[i];
  for (let j = 0; j < arr.length; j++) {
    console.log(arr[j].name);
  }
}

• for of 循环（循环遍历数组元素，其中arr 是元素）：

  for(let arr of dangle) { // get each inner array in dangle (current inner array is referenced as arr)
    for(let obj of arr) { // loop through the contents in the current inner array, where obj is the contents
      console.log(obj.name); // print the name of the contents
    }
  }
  

let dangle =  [[{name:"jack",age:"20"}],[{name:"ram",age:"25"}],[{name:"vishy",age:"45"}]];
         
for(let arr of dangle) {
  for(let obj of arr) {
    console.log(obj.name);
  }
}

• .forEach高阶函数（循环遍历数组元素，其中arr是每个数组中的元素）

  dangle.forEach(arr => arr.forEach(obj => {
    console.log(obj.name);
  }));
  

let dangle =  [[{name:"jack",age:"20"}],[{name:"ram",age:"25"}], [{name:"vishy",age:"45"}]];         

dangle.forEach(arr => arr.forEach(obj => { // loop through the outer array to access each inner array, loop through each inner array
  console.log(obj.name); // print the objects name retrieved from the inner array
}));

注意：在上面的示例中，我使用了 2 个循环。这样做的原因是因为您有一个二维数组（另一个数组中的一个数组）。这意味着外部 for 循环用于访问每个内部数组。然后，内部 for 循环遍历每个内部数组中的元素（在您的情况下为对象）。由于每个内部数组中只有一个对象，因此可以删除内部 for 循环，您可以访问每个内部数组的 0<sup>th</sup> 索引。但是，出于可扩展性和可维护性的目的，我使用了一个内部 for 循环，这样如果您确实有多个对象，它仍然可以工作

因此，您可以使用其中一种 for 循环来使用您的姓名填充一个空数组：

let names = [];
for(let arr of dangle) {
  for(let obj of arr) {
    names.push(obj.name); // add the name to the names array
  }
}

console.log(names);

let dangle=  [[{name:"jack",age:"20"}], [{name:"ram",age:"25"}], [{name:"vishy",age:"45"}]]

let names = [];
for(let arr of dangle) {
  for(let obj of arr) {
    names.push(obj.name); // add the name to the names array
  }
}

console.log(names);