树形结构展示

把平铺的数组转成树状数据

         {id:"02", pid:"01", "name":"小李" },
         {id:"03", pid:"01",   "name":"小王" },
         {id:"04", pid:"", "name":"小陈" },
         {id:"05", pid:"02",   "name":"老王" }]

方法一:

     var newArr = []
     var map = {}
   arr.forEach((item)=>{
     item.children=[]
   map[item.id]=item
   })
 // console.log(map);

   arr.forEach((item)=>{
   // 先找它的上级,如果能找到，说明它有上级，则要把它添加到上级的children中去
    //  如果找不到，说明它没有上级，直接添加newArr
     var parent = map[item.pid]
     // console.log(parent);
     // { id: '01', pid: '', name: '老王', children: [] }
     // { id: '01', pid: '', name: '老王', children: [] }
     // 如果存在则表示item不是最顶层的数据
     if(parent){
       parent.children.push(item) 
     }else{
     // 如果不存在 则是顶层数据
       newArr.push(item)
     }
   })
    // 返回出去
   return newArr
 }
 todo(arr)
 console.log(todo(arr));

• 对引用类型来说，赋值是浅拷贝 ,原数组被修改 了 只能拷贝一层,不能用于多层

方法二:

function todo(arr,pid){
  var newArr = []
  arr.forEach((item)=>{
     // 查找一级根据传进来pid和每一项的pid
    if(item.pid === pid){
      // 1- 还需要往一级里面追加子children
      var children = todo(arr,item.id)
      if(children){
         // 判断二级有不有
        item.children = children
      }
      // 2- 将一级存到返回的数组中
      newArr.push(item)
    }
  })
  return newArr
}
console.log(todo(arr,''));

方法三:装包 ----arrToTree