使用JS递归处理树状结构数据

简介: 使用JS递归处理树状结构数据

使用递归进行处理树形数据

实现方式:

<script>
        //原始从服务器返回的数据
        const temp = [
            {"id":7, "parent":0, "name":"test0"},
            {"id":8, "parent":0, "name":"test1"},
            {"id":9, "parent":0, "name":"test2"},
            {"id":68, "parent":0, "name":"test3"},
            {"id":349, "parent":0, "name":"test4"},
            {"id":74, "parent":7, "name":"test5"},
            {"id":20, "parent":8, "name":"test6"},
            {"id":21, "parent":8, "name":"test7"},
            {"id":67, "parent":8, "name":"test8"},
            {"id":185, "parent":9, "name":"test9"},
            {"id":186, "parent":68, "name":"test10"},
            {"id":187, "parent":68, "name":"test11"},
            {"id":188, "parent":68, "name":"test12"},
            {"id":189, "parent":68, "name":"test13"},
            {"id":190, "parent":185, "name":"test14"},
            {"id":191, "parent":185, "name":"test15"},
            {"id":192, "parent":185, "name":"test16"},
            {"id":350, "parent":349, "name":"test17"},
            {"id":351, "parent":349, "name":"test18"},
        ];
        //处理好的数据
        let res = getTree(temp,0,[]);
        console.log(res);//打印观察
        //处理数据方法
        function getTree(list,pid,data){
            //获取所有一级
            for(let item of list){
                if(item.parent == pid){
                    data.push(item);
                }
            }
            //获取子级
            for(let i of data){
                i.children = [];
                getTree(list,i.id,i.children);//递归调用
                if(i.children.length == 0){
                    delete i.children;
                }
            }
            return data;
        }
</script>
相关文章
|
19天前
|
数据采集 存储 JavaScript
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
本文介绍了如何使用Puppeteer和Node.js爬取大学招生数据,并通过代理IP提升爬取的稳定性和效率。Puppeteer作为一个强大的Node.js库,能够模拟真实浏览器访问,支持JavaScript渲染,适合复杂的爬取任务。文章详细讲解了安装Puppeteer、配置代理IP、实现爬虫代码的步骤,并提供了代码示例。此外,还给出了注意事项和优化建议,帮助读者高效地抓取和分析招生数据。
如何使用Puppeteer和Node.js爬取大学招生数据:入门指南
|
1月前
|
前端开发 JavaScript
JavaScript递归菜单栏
JavaScript递归菜单栏
JavaScript递归菜单栏
|
1月前
|
前端开发 JavaScript
JS-数据筛选
JS-数据筛选
33 7
|
1月前
|
JavaScript 数据安全/隐私保护
2024了,你会使用原生js批量获取表单数据吗
2024了,你会使用原生js批量获取表单数据吗
47 4
|
2月前
|
JavaScript 前端开发 安全
js逆向实战之烯牛数据请求参数加密和返回数据解密
【9月更文挑战第20天】在JavaScript逆向工程中,处理烯牛数据的请求参数加密和返回数据解密颇具挑战。本文详细分析了这一过程,包括网络请求监测、代码分析、加密算法推测及解密逻辑研究,并提供了实战步骤,如确定加密入口点、逆向分析算法及模拟加密解密过程。此外,还强调了法律合规性和安全性的重要性,帮助读者合法且安全地进行逆向工程。
89 11
|
2月前
|
JSON JavaScript 前端开发
JavaScript第五天(函数,this,严格模式,高阶函数,闭包,递归,正则,ES6)高级
JavaScript第五天(函数,this,严格模式,高阶函数,闭包,递归,正则,ES6)高级
|
1月前
|
机器学习/深度学习 JSON JavaScript
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
28 0
|
1月前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
|
2月前
|
JSON JavaScript 前端开发
6-19|Python数据传到JS的方法
6-19|Python数据传到JS的方法
|
3月前
|
Java 开发者 关系型数据库
JSF与AWS的神秘之旅:如何在云端部署JSF应用,让你的Web应用如虎添翼?
【8月更文挑战第31天】在云计算蓬勃发展的今天,AWS已成为企业级应用的首选平台。本文探讨了在AWS上部署JSF(JavaServer Faces)应用的方法,这是一种广泛使用的Java Web框架。通过了解并利用AWS的基础设施与服务,如EC2、RDS 和 S3,开发者能够高效地部署和管理JSF应用。文章还提供了具体的部署步骤示例,并讨论了使用AWS可能遇到的挑战及应对策略,帮助开发者更好地利用AWS的强大功能,提升Web应用开发效率。
65 0