如何在javascript中将数组转换为树结构答案

【问题标题】：How to convert array into a tree structure in javascript如何在javascript中将数组转换为树结构
【发布时间】：2020-11-12 19:59:53
【问题描述】：

这是我的数组。我只是想用祖父母->父母->孩子姓名关系来构建层次结构树。请帮我解决这个问题。示例输入如下所示

data = 
[
{name:'111',parent:'11',grandparent:'1'},
{name:'112',parent:'11',grandparent:'1'},
{name:'121',parent:'12',grandparent:'1'},
{name:'211',parent:'21',grandparent:'2'}
]

预期输出是这样的。如有语法错误请忽略

[
    {
    name:'1',
    children:[
              {
                name:'11',
                children:[
                    {
                        name:'111',
                        children:[]
                    },
                    {
                        name:'112',
                        children:[]
                    }
                ]
              },
              {
                  name:'12',
                  children:[
                    {
                        name:'121',
                        children:[]
                    }
                  ]
              },
              {
                  name:'21',
                  children:[
                    {
                        name:'211',
                        children:[]
                    }

                  ]
              }
            
            ]
        }
    ]

【问题讨论】：

到目前为止你有什么尝试？
只是在尝试一些东西，但在 2 级之后无法移动它。

标签： javascript arrays angular tree

【解决方案1】：

您可以使用reduce 和forEach 方法来创建嵌套结构和一个数组，您可以在其中指定要迭代的键的顺序。

const data = [{"name":"111","parent":"11","grandparent":"1"},{"name":"112","parent":"11","grandparent":"1"},{"name":"121","parent":"12","grandparent":"1"},{"name":"211","parent":"21","grandparent":"2"}]

const order = ['grandparent', 'parent', 'name'];
const result = [];
const levels = {result}

data.forEach(o => {
  order.reduce((r, e) => {
    const name = o[e];
    if (!r[name]) {
      const value = {name, children: []}
      r[name] = {result: value.children}
      r.result.push(value)
    }

    return r[name]
  }, levels)
})

console.log(result)

【讨论】：

有趣的方法。你从哪里弄来的？

【解决方案2】：

基于@Nenad Vracar 的回答，如果您想用作动态数组值，请使用Object.keys() 和reverse

const data = [{"name":"111","parent":"11","grandparent":"1"},{"name":"112","parent":"11","grandparent":"1"},{"name":"121","parent":"12","grandparent":"1"},{"name":"211","parent":"21","grandparent":"2", "grandgrandparente": "3"}]


const result = [];
const levels = {result}

data.forEach(o => {
  const order = Object.keys(o).reverse();
  order.reduce((r, e) => {
    const name = o[e];
    if (!r[name]) {
      const value = {name, children: []}
      r[name] = {result: value.children}
      r.result.push(value)
    }

    return r[name]
  }, levels)
})

console.log(result)

【讨论】：

是的，我想稍后根据动态修改它。但感谢您提供的解决方案。 @PabloWeb18 :)