javascript - 在 javascript 中给定路径和元素数组构建自定义对象

Question

本质上，我想在给定一组对象的情况下构建一个新结构。对象负载看起来像下面的元素数组。

const data = [
{
  path: [],
  elements: ['Parent A']
},
{
  path: ['Parent A'],
  elements: ['Child A1', 'Child A2', 'Parent B']
},
{
  path: ['Parent A', 'Parent B'],
  elements: ['Child B1', 'Parent C']
},
{
  path: ['Parent A', 'Parent B', 'Parent C'],
  elements: ['Child C1']
},
{
  path: ['Parent D'],
  elements: ['Child D1']
},
]

然后，上面的有效负载将被转换为看起来像这样的自定义对象。

let newObject =
[
 {
  elem: "",
  children: [
   {
    elem: "Parent A",
    children: [
     {
      elem: "Child A1",
      children: []
     },
     {
      elem: "Child A2",
      children: []
     },
     {
      elem: "Parent B",
      children: [
      {
       elem: "Child B1",
       children: []
      },
      {
       elem: "Parent C",
       children: [
       {
        elem: "Child C1",
        children: []
       }
       ]
      },
      ]
     },
    ]
   }
  ]
 },
 {
  elem: "Parent D",
  children: [
   {
    elem: "Child D1",
    children: []
   }
  ]
 }
]

我考虑过制作一个 map ，其中我给每个元素一个访问的属性(以避免重新创建一个元素)并使用递归方法来填充潜在的父元素。但是，我目前陷入困境，正在寻找有关我应该使用的数据结构/方法的反馈。

我的映射器代码

const stringifyPath = (arr) => {
    return arr.join('>');
}

let elemMap = new Map();

data.forEach(item => {
    const itemPath = stringifyPath(item.path);
    if (!elemMap.get(itemPath)) {
        elemMap.set(itemPath, {
            elements: [],
            visited: false
        })
    }
    elemMap.get(itemPath).elements = [...elemMap.get(itemPath).elements, ...item.elements];
});

这产生

{
  '' => { elements: [ 'Parent A' ], visited: false },
  'Parent A' => { elements: [ 'Child A1', 'Child A2', 'Parent B' ],
    visited: false },
  'Parent A>Parent B' => { elements: [ 'Child B1', 'Parent C' ], visited: false },
  'Parent A>Parent B>Parent C' => { elements: [ 'Child C1' ], visited: false },
  'Parent D' => { elements: [ 'Child D1' ], visited: false } }

任何反馈表示赞赏，谢谢!

Answer 1

您可以通过为每个嵌套级别查找对象来减少路径并将新元素推送到找到的对象的子项，从而采用直接的方法。

对我来说，存储所有路径是没有意义的，因为构建结构只需要一次。

var data = [{ path: [], elements: ['Parent A'] }, { path: ['Parent A'], elements: ['Child A1', 'Child A2', 'Parent B'] }, { path: ['Parent A', 'Parent B'], elements: ['Child B1', 'Parent C'] }, { path: ['Parent A', 'Parent B', 'Parent C'], elements: ['Child C1'] }, { path: ['Parent D'], elements: ['Child D1'] }],
    result = data.reduce((r, { path, elements }) => {
        path
            .reduce((array, elem) => {
                var temp = array.find(q => q.elem === elem);
                if (!temp) array.push(temp = { elem, children: [] });
                return temp.children;
            }, r)
            .push(...elements.map(elem => ({ elem, children: [] })));
        return r;
    }, []);

console.log(result);

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