javascript - 从对象数组创建树层次结构

Question

首先，我只想提一下，我确实尝试过为我的问题找到解决方案，但我找不到适合我的东西。事情是，我有这样的数组:

const arr = [
  {
    leafName: 'name1',
    nodes: [1,2,3,4]
  },
  {
    leafName: 'name2',
    nodes: [1,2,3,4]
  },
  {
    leafName: 'name3',
    nodes: [1,2,4,5]
  },
  {
    leafName: 'name4',
    nodes: [6]
  }
];

我希望得到的是:

const expectedTree = {
  name: 'some root name',
  children: [
    {
      name: 1,
      children: [
        {
          name: 2,
          children: [
            {
              name: 3,
              children: [
                {
                  name: 4,
                  children: [
                    {
                      name: 'name1'
                    },
                    {
                      name: 'name2'
                    }
                  ]
                }
              ]
            },
            {
              name: 4,
              children: [
                {
                  name: 5,
                  children: [
                    {
                      name: 'name3'
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    },
    {
      name: 6,
      children: [
        {
          name: 'name4'
        }
      ]
    }
  ]
};

如您所见，leafName 应该是树分支中的最后一个节点。此外，如果从根节点到某个其他节点存在部分匹配，则应从最后匹配的节点添加新的子节点。例如让 arr[1].nodes 和 arr[2].nodes 前两个成员匹配，这意味着它们应该在同一个分支中，只有 4 和 5从 arr[2].nodes 拆分到单独的分支(作为 { name: 2, children: [should go here] } 的子级)。我真的希望你明白这个想法，我也希望有人能帮助我。因为我已经坚持了两天了，而且我自己也想不出“干净”的解决方案。

如有任何意见，我们将不胜感激。 ;)

Answer 1

您可以循环数组和节点，并通过查看每个级别的相同名称来减少节点。如果一个节点不存在，则创建一个新节点并返回该节点的子节点。

var array = [{ leafName: 'name1', nodes: [1, 2, 3, 4] }, { leafName: 'name2', nodes: [1, 2, 3, 4] }, { leafName: 'name3', nodes: [1, 2, 4, 5] }, { leafName: 'name4', nodes: [6] }],
    result = [];

array.forEach(({ leafName, nodes }) => {
    nodes
        .reduce((level, name) => {
            var temp = level.find(o => o.name === name);
            if (!temp) {
                level.push(temp = { name });
            }
            return temp.children = temp.children || [];
        }, result)
        .push({ name: leafName });
});

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }