【扁平数据转树状数据最快方法】

最新推荐文章于 2024-10-17 09:40:47 发布

web爱好学习者

最新推荐文章于 2024-10-17 09:40:47 发布

阅读量73

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/qq_40493588/article/details/130993041

版权

该文章提供了一个JavaScript函数示例，用于将扁平结构的菜单数据转换为树形结构。函数名为`buildTree`，它遍历输入的数据数组，创建一个映射对象，并根据`superior`字段构建子节点关系。最后返回根节点组成的树结构。

摘要由CSDN通过智能技术生成

扁平数据转树状数据最快方法

示例代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        var menu = [{
            id: 1,
            menuName: '地图显示',
            path: '/view',
            sort: 1,
            superior: null,
            components: '/common/secondLevelMenu',
        },
        {
            id: 2,
            sort: 1,
            menuName: '基础地图',
            path: '/view3',
            superior: 1,
            components: '/common/secondLevelMenu2',
        },
        {
            id: 3,
            sort: 1,
            menuName: '基础地图',
            path: '/view3',
            superior: 2,
            components: '/common/secondLevelMenu2',
        },
        {
            id: 4,
            sort: 1,
            menuName: '基础地图',
            path: '/view3',
            superior: 3,
            components: '/common/secondLevelMenu2',
        }
        ]
        function buildTree (data) {
            const map = {};
            const tree = [];
            data.forEach(node => {
                map[node.id] = node;//让枚举数据和node公用同一个内存 主要
                node.children = [];
            });
            data.forEach(node => {
                if (node.superior) {
                    map[node.superior].children.push(node);
                } else {
                    tree.push(node);
                }
            });
            return tree;
        }
        console.log(buildTree(menu));
    </script>
</body>

</html>