js 树形结构 数组 互转

let arr=[
 {id:"01", pid:"",   "name":"老王" },
 {id:"02", pid:"01", "name":"小张" },
 {id:"03", pid:"02", "name":"小小张" },
 {id:"04", pid:"",   "name":"老陈" }
];
tranListToTreeData(arr)
function tranListToTreeData(arr) {
    const newArr = []
    // 1. 构建一个字典：能够快速根据id找到对象。
    const map = {}

    arr.forEach(item => {
      // 为了计算方便，统一添加children
      item.children = []
      // 构建一个字典
      const key = item.id
      map[key] = item
    })
   
    // 2. 对于arr中的每一项
    arr.forEach(item => {
      const parent = map[item.pid]
      if (parent) {
        //    如果它有父级，把当前对象添加父级元素的children中
        parent.children.push(item)
      } else {
        //    如果它没有父级（pid:''）,直接添加到newArr
        newArr.push(item)
      }
    })
   
    return newArr
  }
let arr = [{
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "111",
    "bdictDesc": "测试1",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "222",
    "bdictDesc": "测试2",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "333",
    "bdictDesc": "测试3",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "444",
    "bdictDesc": "测试4",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "555",
    "bdictDesc": "测试5",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA",
    "bdictDesc": "测试6",
    "pid": "0",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA01",
    "bdictDesc": "测试7",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA0101",
    "bdictDesc": "测试8",
    "pid": "DOCA01",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA0102",
    "bdictDesc": "测试9",
    "pid": "DOCA01",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA0103",
    "bdictDesc": "测试10",
    "pid": "DOCA01",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA02",
    "bdictDesc": "测试11",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA03",
    "bdictDesc": "测试12",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA0301",
    "bdictDesc": "测试13",
    "pid": "DOCA03",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA0302",
    "bdictDesc": "测试14",
    "pid": "DOCA03",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA04",
    "bdictDesc": "测试15",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA05",
    "bdictDesc": "测试16",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA06",
    "bdictDesc": "测试17",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA07",
    "bdictDesc": "测试18",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA08",
    "bdictDesc": "测试19",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA09",
    "bdictDesc": "测试20",
    "pid": "DOCA",
    "validStatus": "1"
}, {
    "categoryCode": "90000",
    "categoryCnName": "A1级别",
    "id": "DOCA10",
    "bdictDesc": "测试21",
    "pid": "DOCA",
    "validStatus": "1"
}, ]

function arrayToTree(list, parentID) {
    const child = function(pareID) {
        //先定义一个数组，用于存储所查到的子元素
        const childs = [];
        //循环数组
        for (let i = 0; i < list.length; i++) {
            //如果数组其中一项的pid等于传入的，说明这一项是传入的子元素，把他push进数组，然后重复递归自己找该项的子元素
            if (list[i].pid === pareID) {
                if (child(list[i].id).length > 0) {
                    list[i].children = child(list[i].id);
                }
                childs.push(list[i]);
            }
        }
        //最后将查到的所有子元素返回
        return childs;
    };
    return child(parentID);
}



let tree22 = [
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "111",
        "bdictDesc": "测试1",
        "pid": "0",
        "validStatus": "1"
    },
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "222",
        "bdictDesc": "测试2",
        "pid": "0",
        "validStatus": "1"
    },
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "333",
        "bdictDesc": "测试3",
        "pid": "0",
        "validStatus": "1"
    },
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "444",
        "bdictDesc": "测试4",
        "pid": "0",
        "validStatus": "1"
    },
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "555",
        "bdictDesc": "测试5",
        "pid": "0",
        "validStatus": "1"
    },
    {
        "categoryCode": "90000",
        "categoryCnName": "A1级别",
        "id": "DOCA",
        "bdictDesc": "测试6",
        "pid": "0",
        "validStatus": "1",
        "children": [
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA01",
                "bdictDesc": "测试7",
                "pid": "DOCA",
                "validStatus": "1",
                "children": [
                    {
                        "categoryCode": "90000",
                        "categoryCnName": "A1级别",
                        "id": "DOCA0101",
                        "bdictDesc": "测试8",
                        "pid": "DOCA01",
                        "validStatus": "1"
                    },
                    {
                        "categoryCode": "90000",
                        "categoryCnName": "A1级别",
                        "id": "DOCA0102",
                        "bdictDesc": "测试9",
                        "pid": "DOCA01",
                        "validStatus": "1"
                    },
                    {
                        "categoryCode": "90000",
                        "categoryCnName": "A1级别",
                        "id": "DOCA0103",
                        "bdictDesc": "测试10",
                        "pid": "DOCA01",
                        "validStatus": "1"
                    }
                ]
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA02",
                "bdictDesc": "测试11",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA03",
                "bdictDesc": "测试12",
                "pid": "DOCA",
                "validStatus": "1",
                "children": [
                    {
                        "categoryCode": "90000",
                        "categoryCnName": "A1级别",
                        "id": "DOCA0301",
                        "bdictDesc": "测试13",
                        "pid": "DOCA03",
                        "validStatus": "1"
                    },
                    {
                        "categoryCode": "90000",
                        "categoryCnName": "A1级别",
                        "id": "DOCA0302",
                        "bdictDesc": "测试14",
                        "pid": "DOCA03",
                        "validStatus": "1"
                    }
                ]
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA04",
                "bdictDesc": "测试15",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA05",
                "bdictDesc": "测试16",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA06",
                "bdictDesc": "测试17",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA07",
                "bdictDesc": "测试18",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA08",
                "bdictDesc": "测试19",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA09",
                "bdictDesc": "测试20",
                "pid": "DOCA",
                "validStatus": "1"
            },
            {
                "categoryCode": "90000",
                "categoryCnName": "A1级别",
                "id": "DOCA10",
                "bdictDesc": "测试21",
                "pid": "DOCA",
                "validStatus": "1"
            }
        ]
    }
]

let treeRes = [];

function tree2arr(res) {
    res.forEach(item => {
        if (!item.children) {
            treeRes.push(item)
        } else {
            let obj = {
                ...item,
                children: null
            }
            delete obj.children
            treeRes.push(obj)
            tree2arr(item.children)
        }
    })
}
// 此处的res取的是上边的数组转树的结果
tree2arr(tree22)
console.log(treeRes);