Как я могу создать вложенное дерево в объекте массива

Question

Следуя данным объекта массива: используя структуры данных Javascript, как я могу перебирать объект массива в массив дочерних элементов каждый раз, когда я получаю новых дочерних элементов, используя его идентификатор и идентификатор родителя.

Попытка найти родительский Id и дочерние вложенные корневые узлы с помощью javascript, но я не смог найти, как перебрать объект массива в его дочерний массив. Кто-нибудь может мне помочь.

var data = [ 
  { id: 7, label: 'a', parentId: 2, childerns: [] },
  { id: 7, label: 'm', parentId: 2, childerns: [] },
  { id: 2, label: 'b', parentId: 5, childerns: [] },
  { id: 5, label: 'c', parentId: 20, childerns: [] },
  { id: 20, label: 'x', parentId: null, childerns: [] },
  { id: 8, label: 'd', parentId: 7, childerns: [] },
  { id: 9, label: 'n', parentId: 8, childerns: [] },
  { id: 9, label: 'n', parentId: 8, childerns: [] } ];```

and looking for the following nested tree pattern:

```var data = [
    {
        id: 20,
        label: 'x',
        parentId: null,
        childerns: [
            {
                id: 5,
                label: 'c',
                parentId: 20,
                childerns: [{
                    id: 2,
                    label: 'b',
                    parentId: 5,
                    childerns: [
                        {
                            id: 7, 
                            label: 'm',
                            parentId: 2,
                            childerns: [] 
                        },
                        {
                            id: 7,
                            label: 'a',
                            parentId: 2,
                            childerns: [{
                                id: 8,
                                label: 'd',
                                parentId: 7,
                                childerns: [
                                    {
                                        id: 9,
                                        label: 'n',
                                        parentId: 8,
                                        childerns: []
                                    },
                                    {
                                        id: 9,
                                        label: 'n',
                                        parentId: 8,
                                        childerns: []
                                    }
                                ]
                            }]
                        }]
                }]
            }]
    }];```

Answer 1

Мне нравится следующая картина. Во-первых, вы используете объект для отслеживания того, где в исходном массиве живет каждый элемент. Затем вы перебираете исходный массив, добавляя ссылку на текущий элемент в его родительский массив. Если parentId равно нулю, добавьте элемент к roots. После всего этого ваш массив roots будет содержать полное дерево.

const arr = [
  { id: 7, label: 'm', parentId: 2, childerns: [] },
  { id: 2, label: 'b', parentId: 5, childerns: [] },
  { id: 5, label: 'c', parentId: 20, childerns: [] },
  { id: 20, label: 'x', parentId: null, childerns: [] },
  { id: 8, label: 'd', parentId: 7, childerns: [] },
  { id: 9, label: 'n', parentId: 8, childerns: [] },
  { id: 10, label: 'n', parentId: 8, childerns: [] } 
];

// Map element ID to arr index
const arrMap = arr.reduce((acc, el, i) => {
  acc[el.id] = i;
  return acc;
}, {});

const roots = [];

// Push each element to parent's children array
arr.forEach(el => {
  if (el.parentId === null) {
    roots.push(el);
  } else {
    arr[arrMap[el.parentId]].childerns.push(el);
  }
});

console.log(roots);