平铺的数组结构转成树形结构

我们一般在做后管项目中，会遇到将平铺的数组结构转成树形结构的问题，比如说公司部门（财务部/财务核算部）、地区级别（省/市/区）等，下面用伪代码分析一下这个问题；

思路：首先父级和子级之间是有一定联系的，这里定义一个平铺的list数组，有属性id、pid、name属性；id：当前项的id，pid是当前项父级的id，这里是id和pid的关系是有pid表示有父级，它父级的id就是它的pid，没有pid表示没有父级，这样就找到父子之间的联系，伪代码如下：

list=[
{'id':'a','pid':'','name':'总裁办'} pid为空，表示没有父级
{'id':'b','pid':'','name':'财务部'}
{'id':'c','pid':'b','name':'财务核算部'} 父id为b，表示它是id为b的子级
{'id':'d','pid':'b','name':'薪资管理部'} 父id为b，表示它是id为b的子级
]

第一步：定义map存储映射关系,在数组里面放一个空数组children，用来存放子级

map={
  'a':{'id':'a','pid':'','name':'总裁办',children:[]}
  'b':{'id':'b','pid':'','name':'财务部',children:[]}
  'c':{'id':'c','pid':'b','name':'财务核算部',children:[]}
  'd':{'id':'d','pid':'b','name':'薪资管理部',children:[]}
}

第二步：遍历list里的每一项item，找到item的父级obj,如果有父级，就把这一项添加到父级obj里的children数组里；如果没有父级，则直接把该项添加到treeList新数组中，最后要得到的结果如下：

treeList=[
  {'id':'a','pid':'','name':'总裁办'}
  {'id':'b','pid':'','name':'财务部',
  children:[
  {'id':'c','pid':'b','name':'财务核算部'},
  {'id':'d','pid':'b','name':'薪资管理部'}]
  ]

 实现：所以要将平铺的数组结构转成树形结构，我们需要做的就是将lists数组转化成treeList数组，这里封装一个函数，代码如下：

// 将平铺数组转化为树形结构
export function arrayToTree(list) {
  let map = {}
  let treeList = []

  // 创建一个map结构
  list.forEach(item => {
    item.children = [] // 给list中的每一项添加children数组
    map[item.id] = item
  })

  // 对list中的每一项找上级obj， 
  // 有则把该项添加到上级obj的children；
  // 没有就是一级，直接添加到treeList中
  list.forEach(item => {
    const pid = item.pid
    const obj = map[pid]
    if (obj) {
      obj.children.push(item)

    } else {
      treeList.push(item)
    }
  })
  return treeList
}

处理后效果如下 ：

转化后

转化前