如何使用 es6 展平对象的嵌套数组

Question

我有这个对象数组，其中我有另一个对象数组：

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

如何获得

country

的平面数组，如下所示：

[
  { id: "5a60626f1d41c80c8d3f8a85" },
  { id: "5a6062661d41c80c8b2f0413" },
  { 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()

（可能对于大型数组，它的性能可能会较差）

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

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

console.log(transformed)