将嵌套对象虚拟中的项目拉入父对象数组

问题描述

我想使用这个对象数组，其中一些对象包含类似架构的数组，并创建一个新数组，它们都在同一级别。

[
  {
   "name": "United States","slug": "united-states","states":[
     {
      "name": "Arizona","slug": "arizona"
     },{
      "name": "California","slug": "california"
     }
    ]
  },{
   "name": "Canada","slug": "canada",}

]

这应该是最终结果：

[
  {
   "name": "United States","slug": "united-states"
  },{
   "name": "Arizona","slug": "arizona"
  },{
   "name": "California","slug": "california"
  },}

]

解决方法

使用 Array#flatMap：

const data = [
  {
    "name": "United States","slug": "united-states","states":[
      { "name": "Arizona","slug": "arizona" },{ "name": "California","slug": "california" }
    ]
  },{ "name": "Canada","slug": "canada" }
];

const res = data.flatMap(({ name,slug,states = [] }) => ([
  { name,slug },...states
]));

console.log(res);

,

您可以创建一个迭代器来遍历树，然后将其消耗到数组中。这适用于更深的嵌套级别，并且不需要知道哪个属性具有子记录。它假设具有 Array 值的属性持有子树：

function * traverse(forest) {
    for (const item of forest) {
        const arrayKey = Object.entries(item).find(([k,v]) => Array.isArray(v))?.[0];
        const { [arrayKey]: children,...rest } = item;
        yield rest;
        if (children) yield * traverse(children);
    }
}

const data = [{"name": "United States","states":[{ "name": "Arizona","slug": "california" }]},"slug": "canada" }];

const res = [...traverse(data)];

console.log(res);