将对象数组转换为树形数组

最新推荐文章于 2022-06-11 17:10:35 发布

Study_Live_Sun

最新推荐文章于 2022-06-11 17:10:35 发布

阅读量758

点赞数 1

原文链接：https://www.cnblogs.com/mengfangui/p/10494601.html

版权

source = [{
                id: 1,
                pid: 0,
                name: 'body'
            }, {
                id: 2,
                pid: 1,
                name: 'title'
            }, {
                id: 3,
                pid: 2,
                name: 'div'
            }]
            转换为: [{
                        id: 1,
                        pid: 0,
                        name: 'body',
                        children: [{
                                id: 2,
                                pid: 1,
                                name: 'title',
                                children: [{
                                    id: 3,
                                    pid: 1,
                                    name: 'div'
                                }]
                            }
                        }]

代码实现：

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

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

    <body>
        <script>
            var source = [{
                id: 1,
                pid: 0,
                name: 'body'
            }, {
                id: 2,
                pid: 1,
                name: 'title'
            }, {
                id: 3,
                pid: 1,
                name: 'div'
            }, {
                id: 4,
                pid: 3,
                name: 'span'
            }, {
                id: 5,
                pid: 3,
                name: 'icon'
            }, {
                id: 6,
                pid: 4,
                name: 'subspan'
            }]

            function toTree(data) {
                let result = []
                if(!Array.isArray(data)) {
                    return result
                }
                data.forEach(item => {
                    delete item.children;
                });
                let map = {};
                data.forEach(item => {
                    map[item.id] = item;
                });
                data.forEach(item => {
                    let parent = map[item.pid];
                    if(parent) {
                        (parent.children || (parent.children = [])).push(item);
                    } else {
                        result.push(item);
                    }
                });
                return result;
            }
            console.log(toTree(source))
        </script>
    </body>

</html>