如何使用es6展平嵌套的對象數組

Question

我有這個對象數組，其中我有另一個對象數組，如何獲取：

[
  { id: "5a60626f1d41c80c8d3f8a85" },
  { id: "5a6062661d41c80c8b2f0413" },
  { id: "5a60626f1d41c80c8d3f8a83" },
  { id: "5a60626f1d41c80c8d3f8a84" }
];

來自：

[
  {
    id: 1,
    country: [
      {
        id: "5a60626f1d41c80c8d3f8a85"
      },
      {
        id: "5a6062661d41c80c8b2f0413"
      }
    ]
  },
  {
    id: 2,
    country: [
      {
        id: "5a60626f1d41c80c8d3f8a83"
      },
      {
        id: "5a60626f1d41c80c8d3f8a84"
      }
    ]
  }
];

不使用forEach和臨時變量？

當我這樣做時：

(data || []).map(o=>{
  return o.country.map(o2=>({id: o2.id}))
})

我得到了相同的結構。

Answer 1

最新編輯

所有現代 JS 環境現在都支持Array.prototype.flat和Array.prototype.flatMap

 const data=[{id:1,country:[{id:"5a60626f1d41c80c8d3f8a85"},{id:"5a6062661d41c80c8b2f0413"}]},{id:2,country:[{id:"5a60626f1d41c80c8d3f8a83"},{id:"5a60626f1d41c80c8d3f8a84"}]}]; console.log( data.flatMap( (elem) => elem.country ) )

---

舊答案

不需要任何 ES6 魔法，你可以通過連接內部country數組來減少數組。

 const data=[{id:1,country:[{id:"5a60626f1d41c80c8d3f8a85"},{id:"5a6062661d41c80c8b2f0413"}]},{id:2,country:[{id:"5a60626f1d41c80c8d3f8a83"},{id:"5a60626f1d41c80c8d3f8a84"}]}]; console.log( data.reduce( (arr, elem) => arr.concat(elem.country), [] ) )

如果您想要 ES6 功能（箭頭函數除外），請使用數組展開而不是 concat 方法：

 const data=[{id:1,country:[{id:"5a60626f1d41c80c8d3f8a85"},{id:"5a6062661d41c80c8b2f0413"}]},{id:2,country:[{id:"5a60626f1d41c80c8d3f8a83"},{id:"5a60626f1d41c80c8d3f8a84"}]}]; console.log( data.reduce( (arr, elem) => [...arr, ...elem.country], [] ) )

注意：這些建議會在每次迭代時創建一個新數組。

為了效率，你必須犧牲一些優雅：

 const data=[{id:1,country:[{id:"5a60626f1d41c80c8d3f8a85"},{id:"5a6062661d41c80c8b2f0413"}]},{id:2,country:[{id:"5a60626f1d41c80c8d3f8a83"},{id:"5a60626f1d41c80c8d3f8a84"}]}]; console.log( data.reduce( (arr, elem) => { for (const c of elem.country) { arr.push(c); } return arr; }, [] ) )

Answer 2

 const raw = [ { id: 1, country: [ { id: "5a60626f1d41c80c8d3f8a85" }, { id: "5a6062661d41c80c8b2f0413" } ] }, { id: 2, country: [ { id: "5a60626f1d41c80c8d3f8a83" }, { id: "5a60626f1d41c80c8d3f8a84" } ] } ]; const countryIds = raw .map(x => x.country) .reduce((acc, curr) => { return [ ...acc, ...curr.map(x => x.id) ]; }, []); console.log(countryIds)

Answer 3

這行得通，只需連接您的解決方案返回的嵌套數組

 let arr = [{ "id": 1, "country": [{ "id": "5a60626f1d41c80c8d3f8a85", }, { "id": "5a6062661d41c80c8b2f0413", } ] }, { "id": 2, "country": [{ "id": "5a60626f1d41c80c8d3f8a83", }, { "id": "5a60626f1d41c80c8d3f8a84", } ] } ]; //If you want an array of country objects console.log([].concat.apply(...(arr || []).map(o=> o.country))) //If you can an array od country ids console.log([].concat.apply(...(arr || []).map(o=> o.country.map(country => country.id))))

Answer 4

Ayush Gupta 的解決方案適用於這種情況。 但我想提供其他解決方案。

 const arr = [ { id: 1, country: [ { id: '5a60626f1d41c80c8d3f8a85' }, { id: '5a6062661d41c80c8b2f0413' } ] }, { id: 2, country: [ { id: '5a60626f1d41c80c8d3f8a83' }, { id: '5a60626f1d41c80c8d3f8a84' } ] } ]; const ids = arr.reduce( (acc, {country}) => [ ...acc, ...country.map(({id}) => ({ id })) ], [] ); console.log(ids);

Answer 5

對於 JSON 字符串數據，也可以在解析過程中完成：

 var ids = [], json = '[{"id":1,"country":[{"id":"5a60626f1d41c80c8d3f8a85"},{"id":"5a6062661d41c80c8b2f0413"}]},{"id":2,"country":[{"id":"5a60626f1d41c80c8d3f8a83"},{"id":"5a60626f1d41c80c8d3f8a84"}]}]'; JSON.parse(json, (k, v) => v.big && ids.push(v)); console.log( ids );

Answer 6

我不知道為什么沒有人提到flat() （可能對於大型陣列，它的性能可能較低）

(data || []).map(o=>{
  return o.country.map(o2=>({id: o2.id}))
}).flat()