list 转 tree 结构解法案例

list 用例

  1. const treesArr = [
  2.   { id: 16, parentId: 0 },
  3.   { id: 17, parentId: 0 },
  4.   { id: 18, parentId: 16 },
  5.   { id: 19, parentId: 18 },
  6.   { id: 21, parentId: 19 },
  7.   { id: 22, parentId: 21 },
  8.   { id: 23, parentId: 17 },
  9.   { id: 24, parentId: 17 },
  10. ]

解法1

  1. /**
  2.  * @method treesArrToObj 树形数组转化为 object 形式
  3.  * @param {Arrary} treesArr 树形数组
  4.  * @param {Object} treesObj 原始树形结构
  5.  * @return {Object} 树结构
  6.  */
  7. function treesArrToObj(treesArr = [], treesObj = {}) {
  8.   if (!treesArr.length) {
  9.     return treesObj;
  10.   }
  12.   // treesObj 不传或为空对象都视为初始化
  13.   if (!Object.keys(treesObj).length) {
  14.     treesObj.id = Math.min(...treesArr.map(({ parentId }) => parentId));
  15.   }
  17.   const children = treesArr.filter((item, index) => {
  18.     if (item.parentId === treesObj.id) {
  19.       // 用过的都清除掉，防止每次递归的时候都要遍历所有元素
  20.       delete treesArr[index];
  22.       return item.parentId === treesObj.id;
  23.     }
  24.   })
  26.   if (!children.length) {
  27.     return treesObj;
  28.   }
  30.   treesObj.children = children;
  32.   // 再次传递的 treesArr 是没用过的
  33.   treesObj.children.map(item => treesArrToObj(treesArr.filter(item => !!item), item));
  35.   return treesObj;
  36. }