递归书写树形图示例

大叫好,今天书写了一个扁型转换为树型的例子,使用的是递归,请大家食用,无毒

        

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>树结构</title></head><body><script>let arr = [{id: 1,name: "中国",pid: 0}, {id: 78,name: "美国",pid: 0}, {id: 2,name: "河南",pid: 1}, {id: 3,name: "河北",pid: 1}, {id: 4,name: "新乡",pid: 2}, {id: 5,name: "开封",pid: 2}, {id: 6,name: "许昌",pid: 2}, {id: 7,name: "漯河",pid: 2}, {id: 8,name: "石家庄",pid: 3}, {id: 9,name: "邢台",pid: 3}, {id: 10,name: "秦皇岛",pid: 3}, {id: 11,name: "衡水",pid: 3}, {id: 12,name: "延津县",pid: 4}, {id: 13,name: "封丘县",pid: 4}, {id: 14,name: "长垣县",pid: 4}, {id: 15,name: "王楼镇",pid: 12}, {id: 16,name: "牛屯镇",pid: 12}, {id: 17,name: "王屯镇",pid: 12}, {id: 18,name: "刘庄乡",pid: 15}, {id: 19,name: "王庄乡",pid: 15}, {id: 20,name: "陈庄乡",pid: 15}, {id: 21,name: "娄庄乡",pid: 15}, {id: 22,name: "张庄乡",pid: 15}, {id: 23,name: "李庄乡",pid: 15}, {id: 24,name: "草庄乡",pid: 15}, {id: 25,name: "刘庄村",pid: 18}, {id: 26,name: "王庄村",pid: 18}, {id: 27,name: "李庄村",pid: 18}, {id: 28,name: "和庄村",pid: 18}];// 递归函数构建树结构function buildTree(arr, pid) {let result = [];for (let i = 0; i < arr.length; i++) {if (arr[i].pid === pid) {let children = buildTree(arr, arr[i].id);if (children.length) {arr[i].children = children;}result.push(arr[i]);}}return result;}// 构建树结构let tree = buildTree(arr, 0);console.log(tree);</script></body>
</html>

请大家看完之后给我点个关注,谢谢您了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/848430.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Python数据类型的奥秘】:构建程序基石,驾驭信息之海

文章目录 &#x1f680;Python数据类型&#x1f308;1. 基本概念⭐2. 转化&#x1f44a;3. 数值运算&#x1f4a5;4. 数值运算扩展(math库常用函数) &#x1f680;Python数据类型 &#x1f308;1. 基本概念 整数&#xff08;int&#xff09;&#xff1a;整数是没有小数部分的数…

Mongodb中字段的删除

学习mongodb&#xff0c;体会mongodb的每一个使用细节&#xff0c;欢迎阅读威赞的文章。这是威赞发布的第61篇mongodb技术文章&#xff0c;欢迎浏览本专栏威赞发布的其他文章。 本篇文章&#xff0c;探讨UPDATE中的操作符$unset。Mongodb数据插入后&#xff0c;开发人员使用$u…

Android输入法IME(三)

2.2. IME管理端&#xff08;IMMS&#xff09;初始化流程 IMMS运行在system server进程中&#xff0c;属于系统服务的一部分&#xff0c;用于控制输入法的显示/隐藏、切换、绑定等操作。 涉及代码文件路径&#xff1a; IMMS运行在system server进程中&#xff0c;属于系统服务的…

在Nginx中配置php程序环境。

1、在Nginx中配置php程序环境。 打开编辑 /opt/local/etc/nginx/nginx.conf 文件。 http {. . . server {listen 8090;server_name localhost;. . . location / {root html;index index.html index.htm;add_header Access-Control-Allow-Origin *;add_header Acces…

MMKV源码详解

文章目录 前言一、MMKV简介1.mmap2.protobuf 二、MMKV 源码详解1.MMKV初始化2.MMKV对象获取3.文件摘要的映射4.loadFromFile 从文件加载数据5.encode 数据写入 总结 前言 谈到轻量级的数据持久化&#xff0c;在 Android 开发过程中&#xff0c;大家首先想到的应该就是 SharedP…

题号:BC19 题目:反向输出一个四位数

题号&#xff1a;BC19 题目&#xff1a;反向输出一个四位数 废话不多说&#xff0c;上题目&#xff1a; 解题思路&#xff1a; 我们发现可以用%和/两个操作符就可以解决。 代码如下: int main() {int a 0;scanf("%d ",& a);while (a){printf("%d "…

香港 Web3 的分岔路口:to 创新 or to 监管,这并不是一个问题

撰文&#xff1a;Babywhale&#xff0c;Techub News 香港 Web3 的分岔路口&#xff1a;to 创新 or to 监管&#xff0c;这并不是一个问题 刚刚过去的周末&#xff0c;香港虚拟资产交易平台&#xff08;VATP&#xff09;牌照相关的问题再一次引发了讨论。 一年多前&#xff0c…

word模板内容替换

1.pom引入依赖&#xff1a; <dependency><groupId>com.alibaba</groupId><artifactId>easyexcel</artifactId><version>3.0.5</version> </dependency> <dependency><groupId>com.deepoove</groupId><a…

【Vue】普通组件的注册使用-全局注册

文章目录 一、使用步骤二、练习 一、使用步骤 步骤 创建.vue组件&#xff08;三个组成部分&#xff09;main.js中进行全局注册 使用方式 当成HTML标签直接使用 <组件名></组件名> 注意 组件名规范 —> 大驼峰命名法&#xff0c; 如 HmHeader 技巧&#xf…

华安保险:核心系统分布式升级,提升保费规模处理能力2-3倍 | OceanBase企业案例

在3月20日的2024 OceanBase数据库城市行的活动中&#xff0c;安保险信息科技部总经理王在平发表了以“保险行业核心业务系统分布式架构实践”为主题的演讲。本文为该演讲的精彩回顾。 早在2019年&#xff0c;华安保险便开始与OceanBase接触&#xff0c;并着手进行数据库的升级…

雅欣控制HALL IC 产品选型手册,选择您的专属霍尔芯片(霍尔产品主要包括远翔FD,FS全系列,MST全系列霍尔)

HALLICs 应用领域 Applications 应用案例 雅欣为各个应用场景匹配专属HALL元器件 合作伙伴 Partners

专属编程笔记

Utils目录作用 在软件开发中&#xff0c;Utils&#xff08;或 Utilities&#xff09;目录通常用于存放一些通用的、不特定于任何模块的工具类或辅助函数。这些工具类或函数为整个应用程序或多个模块提供便利的功能支持&#xff0c;使得代码更加模块化、易于维护和重用。Utils目…

函数重载和模板的区别与联系

函数重载和模板的区别与联系 函数重载(overloaded)&#xff1a;定义函数名相同而形参列表&#xff08;个数&#xff0c;类别&#xff09;不同的多个函数&#xff0c;这些函数被称为重载函数&#xff0c;重载函数通常执行的操作非常类似&#xff0c;如打印不同的输入对象。调用…

在嵌入式系统中,如何实现日志的实时监控和分析?

在嵌入式系统中&#xff0c;实时监控和分析日志对于快速定位问题、优化性能和保证系统的稳定性至关重要。本文将介绍如何在嵌入式系统中实现日志的实时监控和分析&#xff0c;包括日志的收集、传输、存储和分析。 一、日志收集 日志收集是实时监控和分析的第一步。在嵌入式系…

Echarts 柱状图中每个柱状图如何自定义展示内容

文章目录 需求分析需求 分析 要自定义柱状图中每个柱子的展示内容,您可以通过设置 label 的 formatter 属性来实现。formatter 是一个回调函数,可以用来自定义 label 的显示内容。以下是一个示例代码,演示了如何实现这一点: <!DOCTYPE html> <html lang="e…

【quarks系列】基于Dockerfile构建native镜像

目录 Dockerfile构建代码测试 Dockerfile FROM quay.io/quarkus/ubi-quarkus-native-image:22.3-java11 AS buildWORKDIR /workspace COPY . .RUN ./mvnw -DskipTeststrue clean package -Dnative -U# Stage 2: Create the minimal runtime image FROM registry.access.redhat…

AWS的EC2之间ping不通,服务之间不通,怎么办

AWS启动的两个EC2实例&#xff0c;互相访问不了 修改安全组规则&#xff0c;添加ICMP 流量的入站规则 参考&#xff1a;AWS的EC2之间ping不通,服务之间不通,怎么办_aws ec2同一个区域的服务器-CSDN博客

Linux之关机重启

服务器除了通过界面 进行关机&#xff0c;重启操作&#xff0c;还可以通过命令的方式实现 shutdown [-t seconds] [-rkhncfF] time [message] 常用选项 参数功能-t seconds设定在几秒钟之后进行关机程序-k并不会真的关机&#xff0c;只是将警告讯息传送给所有使用者-r关机后重…

RabbitMQ支持的消息模型

RabbitMQ基础RabbitMQ支持的消息模型 一、第一种模型(直连) 我们将用Java编写两个程序&#xff0c;发送单个消息的生成者和接收消息并打印出来的消费者。 在下图&#xff0c;“P”是生成者&#xff0c;“C”消费者。中间框是一个队列RabbitMQ保留的消息缓冲区 。 首先构建一个…

思维,1209G1 - Into Blocks (easy version)

一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 Problem - 1209G1 - Codeforces 二、解题报告 1、思路分析 考虑&#xff1a; 最终状态为若干段相同数字&#xff0c;且任意两段数字不同 每个数字出现的最左下标和最右下标构成一个区间 连锁反应—…