从JavaScript中双嵌套对象数组中访问和提取值

Question

我有一个对象数组，在这些对象中是另一个对象，它包含一个特定的属性，我希望从该属性中获取值，并将其存储在一个单独的数组中。

如何从下面的数据结构访问和存储来自name属性的值：

pokemon:Object
abilities:Array[2]
  0:Object
    ability:Object
      name:"blaze"
  1:Object
    ability:Object
      name:"solar-power"

如何将name属性中的值返回并显示为一个很好的字符串，如

blaze, solar-power？

我尝试这样做，但我仍然得到一个数组，我不想做第三个循环，因为这不是表演性的。

 let pokemonAbilities = [];
 let test = pokemon.abilities.map((poke) =>
        Object.fromEntries(
          Object.entries(poke).map(([a, b]) => [a, Object.values(b)[0]])
        )
      );

      test.map((t) => pokemonAbilities.push(t.ability));

样本数据：

"pokemon": {
  "abilities": [
    {
      "ability": {
        "name": "friend-guard",
        "url": "https://pokeapi.co/api/v2/ability/132/"
      },
      "ability": {
        "name": "Solar-flare",
        "url": "https://pokeapi.co/api/v2/ability/132/"
      }
    }
  ]
}

然后，我从上面对返回的数组进行连接，以获得格式化的字符串。

看起来多个map()循环是可以优化的，但我不知道如何使它更高效。

谢谢。

Answer 1

不需要循环内的循环。试试这个：

​

const pokemon = {
  abilities: [{
    ability: {
      name: 'friend-guard',
      url: 'https://pokeapi.co/api/v2/ability/132/'
    },
  }, {
    ability: {
      name: 'Solar-flare',
      url: 'https://pokeapi.co/api/v2/ability/132/'
    }
  }]
};

const pokemonAbilities = pokemon.abilities.map(item => item.ability.name).join(', ');

console.log(pokemonAbilities);

​