扁平化数组与树结构的相互转化

某面试出现了这题，让我无从下手(说白了）就是见识短浅了。

[
    {
        "id": "1",
        "menu_name": "设置",
        "parent_id": 0
    },
    {
        "id": "1-1",
        "menu_name": "权限设置",
        "parent_id": "1"
    },
    {
        "id": "1-1-1",
        "menu_name": "用户管理列表",
        "parent_id": "1-1"
    },
    {
        "id": "1-1-2",
        "menu_name": "用户管理新增",
        "parent_id": "1-1"
    },
    {
        "id": "1-1-3",
        "menu_name": "角色管理列表",
        "parent_id": "1-1"
    },
    {
        "id": "1-2",
        "menu_name": "菜单设置",
        "parent_id": "1"
    },
    {
        "id": "1-2-1",
        "menu_name": "菜单列表",
        "parent_id": "1-2"
    },
    {
        "id": "1-2-2",
        "menu_name": "菜单添加",
        "parent_id": "1-2"
    },
    {
        "id": "2",
        "menu_name": "订单",
        "parent_id": 0
    },
    {
        "id": "2-1",
        "menu_name": "报单审核",
        "parent_id": "2"
    },
    {
        "id": "2-2",
        "menu_name": "退款管理",
        "parent_id": "2"
    },
    {
        "id": "2-2-1",
        "menu_name": "退款管理2-1",
        "parent_id": "2-2"
    }
]

[
    {
        "id": "1",
        "menu_name": "设置",
        "parent_id": 0,
        "children": [
            {
                "id": "1-1",
                "menu_name": "权限设置",
                "parent_id": "1",
                "children": [
                    {
                        "id": "1-1-1",
                        "menu_name": "用户管理列表",
                        "parent_id": "1-1"
                    },
                    {
                        "id": "1-1-2",
                        "menu_name": "用户管理新增",
                        "parent_id": "1-1"
                    },
                    {
                        "id": "1-1-3",
                        "menu_name": "角色管理列表",
                        "parent_id": "1-1"
                    }
                ]
            },
            {
                "id": "1-2",
                "menu_name": "菜单设置",
                "parent_id": "1",
                "children": [
                    {
                        "id": "1-2-1",
                        "menu_name": "菜单列表",
                        "parent_id": "1-2"
                    },
                    {
                        "id": "1-2-2",
                        "menu_name": "菜单添加",
                        "parent_id": "1-2"
                    }
                ]
            }
        ]
    },
    {
        "id": "2",
        "menu_name": "订单",
        "parent_id": 0,
        "children": [
            {
                "id": "2-1",
                "menu_name": "报单审核",
                "parent_id": "2"
            },
            {
                "id": "2-2",
                "menu_name": "退款管理",
                "parent_id": "2",
                "children": [
                    {
                        "id": "2-2-1",
                        "menu_name": "退款管理2-1",
                        "parent_id": "2-2"
                    }
                ]
            }
        ]
    }
]

树形结构与扁平化数组的相互转化。

• Array=>Tree

function ArrayToTree(arr) {
            //前提 id pid 不可能重复
            //1.遍历arr 把所有对象的id变成对象的键值,并存这个对象
            let treeObj = {};
            let treeList = []; // 用来储存最终树形结构数据的数组
            arr.forEach(obj => {
                treeObj[obj.id] = obj
            })

            //2.遍历arr 判断pid在也就式该对象是存在treeObj中,没有就把它加在treeList最外层中;
            //存在的话 先判断父级有没有children字段，就创建一个children字段,然后把obj加入父级中
            arr.forEach(obj => {
                let parent = treeObj[obj.parent_id];
                if (parent) {
                    if (!parent['children']) {
                        parent['children'] = []
                    }
                    parent['children'].push(obj)
                } else {
                    treeList.push(obj); //parent == 0情况
                }
            })

            console.log(treeList);

            //
            return treeList;

        }

• Tree to Array

 function TreeToArray(arr) {
            let flatArr = [];
            arr.forEach(obj => {
                let copy = {
                    id: '',
                    menu_name: '',
                    parent_id: '',
                }

                copy.id = obj.id
                copy.menu_name = obj.menu_name
                copy.parent_id = obj.parent_id //怕浅拷贝
                flatArr.push(copy)

                if (obj.hasOwnProperty('children')) {
                    flatArr = flatArr.concat(TreeToArray(obj.children))
                }

            });
            return flatArr;
        }

参考链接：
https://www.itdaan.com/blog/2019/05/17/c6bde09157148d19638f15f68efdee72.html