使用 Javascript 构建 JSON 文件答案

【问题标题】：JSON file structuring using Javascript使用 Javascript 构建 JSON 文件
【发布时间】：2020-06-05 17:17:32
【问题描述】：

[
  {
    "customer": "A",
    "children": [
      {
        "id": "1",
        "name": "B"
      },
      {
        "customer": "B",
        "children": []
      },
      {
        "customer": "C",
        "children": [
          {
            "id": "4",
            "name": "E"
          }
        ]
      },
      {
        "customer": "E",
        "children": [
          {
            "id": "5",
            "name": "F"
          }
        ]
      },
      {
        "customer": "D",
        "children": []
      }
    ]
  }
]

我需要我的输出是这样的，以便在树形图中可视化数据。如何使用 JavaScript 来做到这一点

[
  {
    "customer": "A",
    "children": [
      {
        "customer": "B"
      },
      {
        "customer": "C",
        "children": [
          {
            "customer": "E",
            "children": [
              {
                "customer": "F"
              }
            ]
          }
        ]
      }
    ]
  }
]

我需要我的输出像上面那样，在树形图中可视化数据。我如何使用 JavaScript 来做到这一点，并且我需要我的输出像上面那样，以在树形图中可视化数据？如何使用 JavaScript 做到这一点？

【问题讨论】：

区别在哪里？请删除多余的空格并添加代码，您尝试过。
您能解释一下将输入转换为输出的规则吗？不清楚为什么你会期望你给我们的输出。
@Jacob 没有规则
@NinaScholz 似乎是一项简单的任务，但我发现很难实现。我有包含子对象的对象，在循环它们时我想删除子属性（id 和名称）
您的样本输入是否正确，或者所有客户都应该在数组的顶层并且children 数组都是{ id, name } 对？目前您的问题令人困惑，因为没有解释数据结构并且看起来不一致。

标签： javascript json

【解决方案1】：

在这里做一个很大的假设，但我怀疑您的真正意思是您的示例输入实际上具有这种形状：

const customers = [
  {
    "customer": "A",
    "children": [{ "id": "1", "name": "B" }]
  },
  {
    "customer": "B",
    "children": []
  },
  {
    "customer": "C",
    "children": [{ "id": "4", "name": "E" }]
  },
  {
    "customer": "E",
    "children": [{ "id": "5", "name": "F" }]
  },
  {
    "customer": "D",
    "children": []
  }
]

...并且您希望将所有具有给定 name 的子记录与匹配的客户记录嵌套在其中 name === customer。

我做出这个假设是因为您发布的输入格式与子数组中包含的内容不一致，因此要么输入数据非常奇怪，要么您在发布时打错了字。

假设我是对的，我的方法是遍历所有客户并制作一些地图。一个是parent -> children 的地图，另一个是child -> parent。第一个将帮助我们构建输出树。第二个将帮助我们知道哪些客户应该出现在顶部（他们没有父级）：

const childrenLookup = new Map(); // string -> [string]
const parentLookup = new Map();   // string -> string
for (const { customer: parent, children: childRefs } of customers) {
  const children = childRefs.map(c => c.name);
  childrenLookup.set(parent, children);
  for (const child of children) {
    parentLookup.set(child, parent);
  }
}

现在我们有了一些查找，我们可以开始遍历不是另一个客户的孩子的客户，并使用递归函数构建我们的树

function buildOutput(customers) {
  return customers.map(customer => {
    const result = { customer };
    const children = childrenLookup.get(customer);
    if (children && children.length) {
      result.children = buildOutput(children) 
    }
    return result;
  });
}

const allCustomers = [...childrenLookup.keys()];
const topLevelCustomers = allCustomers.filter(cust => !parentLookup.has(cust));

const result = buildOutput(topLevelCustomers);

使用给定的输入，您现在将获得输出：

[
  {
    customer: "A",
    children: [
      {customer: "B"}
    ]
  },
  {
    customer:"C",
    children: [
      {customer: "E", children":[
        {customer:"F"}
      ]}
    ]
  },
  {"customer":"D"}
]

【讨论】：