Как на javascript сделать древовидную структуру массива из массива из трёх полей id, name, parent?

Question

Подскажите, если я имею массив подобного вида и на сервере хранится в подобной структуре

[
  id:1,name:"Text",parent:0,
  id:2,name: "Folder in Parent Folder with id 1", parent: 1,
  id:555, name: "Rekursive folder in Folder 2....", parent:2
]

Я бы хотел в списке отрисовать эти данные, полученные данные отрисовать из массива, где parent это родительский элемент.

[
 id:1, name:"Text",
 children: [
   id:2,name: "Folder in Parent Folder with id 1", 
   children: [
     id:555, name: "Rekursive folder in Folder 2...."
   ]
]

Как это преобразовать рекурсивно, так как неизвестен уровень вложений?

Answer 1

Делается просто.

m1 = Мар(id, object) - мап всех элементов массива. Вам нужно хранить ссылки всех объектов в развернутом виде.
Пробегаете по исходному массиву находите по id парента объект в m1 добавляете дочку в него. сам объект добавляете в m1 предварительно преобразовав (+ children: []).
Выбираете только те у которых парент 0

Answer 2

const data=[
  {id:1,name:"Text",parent:0},
  {id:2,name: "Folder in Parent Folder with id 1", parent: 1},
  {id:555, name: "Rekursive folder in Folder 2....", parent:2}
]

const dataObj = data.reduce((acc,item)=>{
  acc[item.id]={
    id:item.id,
    name:item.name,
    children:[]
  }
  return acc
},{});

const result = data.reduce((acc,item)=>{
  if(item.parent===0) acc.push(dataObj[item.id])
  else if(dataObj[item.parent] && dataObj[item.id]) dataObj[item.parent].children.push(dataObj[item.id]);
  return acc;
},[]);

console.log(result);

БЛОГ НА HUSL

Как на javascript сделать древовидную структуру массива из массива из трёх полей id, name, parent?

Ответы (2 шт):