Как получить родительский путь до последнего ребенка в JavaScript

Question

Мне трудно найти путь от родителя к ребенку.

Ниже "fullPath" - это то, чего я пытаюсь достичь. Получить родительский путь и дочерний путь.

[{
    "name": "menu1",
    "path": "/path1",
    "id": 1,
    "parentId": 0,
    "item": [{
        "name": "subMenu1",
        "path": "/itemPath1",
        "parentId": 1,
        "id": 3,
        "fullpath": "/path1/itemPath1"
    }, {
        "name": "subMenu2",
        "path": "/itemPath2",
        "parentId": 1,
        "id": 4,
        "fullpath": "/path1/itemPath2"
    }]

}, {
    "name": "menu2",
    "path": "/path2",
    "id": 2,
    "parentId": 0,
    "item": [{
        "name": "subMenu2",
        "path": "/itemPath2",
        "parentId": 2,
        "id": 5,
        "fullpath": "/path2/itemPath2"
    }]

}]

Функция javascript, использованная для создания вышеуказанного json.

var getList = function(list) {
                var result = {items: []},length = list.length;

                var tmpStore = {}
                var i, item, id, pId;

                for (i = 0; i < length; ++i) {
                    item = list[i];
                    id = item.id;
                    tmpStore[id] = item;
                    pId = parseInt(item.parentId, 10);

                    if (pId === 0) {
                        result.items.push(item);
                    } else {

                        if (typeof tmpStore[pId].items === 'undefined') {
                            tmpStore[pId].items = [];
                        }
                        tmpStore[pId].items.push(item);
                    }


                }

                return result;
            };

            var output = getList(list1);
            var sideDetailsInfo = output.items;
            console.log(sideDetailsInfo)

// Вышеуказанная функция создана фуюшимоя.

var list1 variable contains the below.

var list1 = [{
        "name": "menu1",
        "id": 1,
        "parentid": 0,
        "path": "/path1"
    }, {
        "name": "menu2",
        "id": 2,
        "parentid": 0,
        "path": "/path2"
    }, {
        "name": "subMenu1",
        "id": 3,
        "parentid": 1,
        "path": "/itemPath1"
    }, {
        "name": "subMenu2",
        "id": 4,
        "parentid": 1,
        "path": "/itemPath2"
    }, {
        "name": "subMenu2",
        "id": 5,
        "parentid": 2,
        "path": "/itemPath2"
    }]

Ваша помощь приветствуется, и любые советы будут великолепны.

Answer 1

Начиная с корневого уровня, вы хотите пройтись по каждому уровню родителей и найти детей, которые принадлежат каждому из родителей.Затем просто объедините строку родительского пути с дочерним и перезапишите его дочернему.Мы можем просто отредактировать отфильтрованный массив уровней, потому что он все еще ссылается на объекты в исходном массиве.Я использовал рекурсию в следующем коде:

// find all root level elements with parentid of 0
var rootArray = origArray.filter(function(elem) {
   return elem.parentid === 0;
});
doPaths(rootArray); // initial call recursive function

function doPaths(levelArray) {
  levelArray.forEach(function(pelem) { // get current level elements
    var childArray = origArray.filter(function(celem) { // get child elements
      return celem.parentid === pelem.id;
    });
    if (childArray.length > 0) { // child elements were found
      childArray.forEach(function(celem) { // change the path of the child elements
        celem.path = pelem.path + celem.path;
      });
      doPath(childArray); // recursive call to get children of children etc...
    }
  });
}

Результат:

[{ ​​
  id: 1
  name: "menu1"​
  parentid: 0
  path: "/path1"
}, {
  id: 2
  name: "menu2"    ​​
  parentid: 0    ​​
  path: "/path2"    ​​    ​
}, {  ​​
  id: 3    ​​
  name: "subMenu1"    ​​
  parentid: 1    ​​
  path: "/path1/itemPath1"    ​​  ​
}, { ​​
  id: 4 ​​
  name: "subMenu2"    ​​
  parentid: 1
  path: "/path1/itemPath2"
}, {
  id: 5   ​​
  name: "subMenu3"
  parentid: 2
  path: "/path2/itemPath3"
}, { ​​
  id: 6    ​​
  name: "subSubMenu1"   ​​
  parentid: 5    ​​
  path: "/path2/itemPath3/subitemPath1"    ​​
​}, {  ​​
  id: 7  ​​
  name: "subSubSubMenu1" ​​
  parentid: 6
  path: "/path2/itemPath3/subitemPath1/subsubitemPath2"
}]