js遍历树形结构并返回所有的子节点id值
场景
很多时候我么需要返回返回tree结构下的所有自己节点
很显然这个时候需要遍历了
废话不多说
直接递归遍历
数据结构
var treeData = [{
id: 111,
title: "机构1",
children: [{
id: 123,
title: "机构1",
},
{
id: 11123,
title: "机构1231",
children: [{
id: 111211231233,
title: "机构1231",
}]
},
{
id: 11121212123,
title: "机构11111231",
}
]
},
{
id: 1112111113,
title: "机构1211131",
children: [{
id: 1110000211231233,
title: "机构12300001",
}]
},
{
id: 110001112113,
title: "机构1211000111211331",
children: [{
id: 11100999911231233,
title: "机构100002300001",
children: [{
id: 100,
title: "机构l",
}]
}]
},
{
id: 9999,
title: "部门11",
children: [{
id: 000233,
title: "部门31",
children: [{
id: 110,
title: "机2构l",
}]
}]
},
]
我的思路
首先肯定是需要进行循环的,我使用的是for of循环
假设tree数据是一个[{},{}]这样类型的
那么直接将id值push进去就可以了
如果{}中有children这个字段的话
我们需要判断是否有children并且长度是否大于0
if (item.children && item.children.length)
如果有的话
我们需要自己调用自己并且需要传递参数给自己
第一个参数肯定被遍历的值;也就是 item.children
第二个参数是arr,用来需要返回的所有id值
返回所有的id值
function lookForAllId(data = [], arr = []) {
for (let item of data) {
arr.push(item.id)
if (item.children && item.children.length) lookForAllId(item.children, arr)
}
return arr
}
console.log(lookForAllId(treeData));

还有没有更优秀的写法
明天继续写
js遍历树形结构并返回所有的子节点id值的更多相关文章
- 树形结构的数据库表Schema设计-基于左右值编码
树形结构的数据库表Schema设计 程序设计过程中,我们常常用树形结构来表征某些数据的关联关系,如企业上下级部门.栏目结构.商品分类等等,通常而言,这些树状结构需要借助于数据库完 成持久化.然而目前的 ...
- vue_elementUI_ tree树形控件 获取选中的父节点ID
el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID想要获取选中父节点的id;需要如下操作1. 找到工程下的node_m ...
- js,jq获取父,兄弟,子节点整理
js获取节点 父: parentNode 获取已知节点的父节点. 子: childNodes; 得到全部子节点 children 得到全部子节点 firstChild 获得第一个子节点 lastChi ...
- js和jq获取父,兄弟,子节点
1,js获取节点: 父: parentNode 获取已知节点的父节点. 子: childNodes; 得到全部子节点 children 得到全部子节点 firstChild 获得第一个子节点 last ...
- element el-tree循环遍历树形结构,并动态赋值disabled属性
凌晨3点,功夫不负有心人,已经累趴,效果终于出来: 贴上代码: <style scoped> .form { width: 50%; } </style> <templa ...
- js遍历ajax回调函数返回值中的object对象
function printObject(obj) { //obj = {"cid":"C0","ctext":"区县& ...
- 别再写一堆的 for 循环了!Java 8 中的 Stream 轻松遍历树形结构,是真的牛逼
实体类:Menu.java /** * Menu * * @author lcry */ @Data @Builder public class Menu { /** * id */ public I ...
- Js 遍历json对象所有key及根据动态key获取值
var obj = {}; for(var k in obj) { //遍历对象,k即为key,obj[k]为当前k对应的值 console.log(obj[k]); } 文章来自:https://z ...
- Mybatis+Mysql插入数据库返回自增主键id值的三种方法
一.场景: 插入数据库的值需要立即得到返回的主键id进行下一步程序操作 二.解决方法: 第一种:使用通用mapper的插入方法 Mapper.insertSelective(record): 此方法: ...
- oracle使用execute immediate方式完成函数动态传入表名并操作 返回新的主键id值
CREATE OR REPLACE FUNCTION SEQ1 (v_bname in VARCHAR2) return NUMBER is v_bcount NUMBER; BEGIN execut ...
随机推荐
- Git hooks与自动化部署
好的 commit message 是至关重要的,如果随意编写 log,带来的后果可小可大,但是无论大小都影响了开发的效率和回朔的难度,所以有必要进行 log 规范化检查. 通过自定义的commit ...
- 中断操作:AbortController学习笔记
前端面试一般喜欢问: 请手写一个带取消功能的延迟函数,axios 取消功能的原理是什么? 如何中断请求fetch的原理分析和应用? 在看来<使用 AbortController 终止 fetch ...
- 企业诊断屋:在线小说企业如何用A/B测试赋能业务
更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 近两年来,在线小说领域业务发展"降速",相较于几年前的快速扩张,2022年后国内在线小说企 ...
- 火山引擎 DataTester 3 大功能升级:聚焦敏捷、智能与易用,帮助企业降本增效
更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 近日,火山引擎数智平台(VeDI)全面升级旗下 A/B 测试产品 DataTester,发布全新功能"M ...
- 火山引擎云原生数据仓库 ByteHouse 技术白皮书 V1.0 (Ⅲ)
更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群 近日,<火山引擎云原生数据仓库 ByteHouse 技术白皮书>正式发布.白皮书简述了 ByteHou ...
- ThreadPoolExecutor 介绍
线程池能够带来3个好处: 降低资源消耗:通过重复利用已创建的线程降低线程创建和销毁造成的消耗:提高响应速度:当任务到达时,任务可以不需要等到线程创建就能立即执行:提高线程的可管理性:线程是稀缺资源,如 ...
- CO02生产订单新增组件
"-----------------------------------------@斌将军-------------------------------------------- LOOP ...
- 它来了!真正的 python 多线程
哈喽大家好,我是咸鱼 几天前,IBM 工程师 Martin Heinz 发文表示 python 3.12 版本回引入"Per-Interpreter GIL",有了这个 Per-I ...
- 【译】 双向流传输和ASP.NET Core 3.0上的gRPC简介
原文相关 原文作者:Eduard Los 原文地址:https://medium.com/@eddyf1xxxer/bi-directional-streaming-and-introduction- ...
- python代码打包exe程序
1.安装pyinstaller 命令行输入:pip install pyinstaller 2.打包exe程序 输入命令:pyinstaller -F -w *.py(星号是.py的全部路径) pyi ...