zoukankan html css js c++ java

js 数组转为树形结构

题目：

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;
            }
var TreeData =toTree(source)
console.log(TreeData )
console.log(JSON.stringify(TreeData))
        </script>
    </body>

</html>

转载于： https://www.cnblogs.com/mengfangui/p/10494601.html

查看全文

相关阅读:
弹性布局、动画、过渡
 HTML
数据库对象
 函数
 oracle与PL/SQL安装
 网络编程
 多线程
 联调接口
 vue 全局变量
 vue ajax请求

原文地址：https://www.cnblogs.com/zj19940610/p/14133138.html

js 数组 转为树形结构

js 数组转为树形结构