深入理解JS树结构深度优先算法,有哪些知识点
Admin 2022-11-15 群英技术资讯 272 次浏览
在现实生活中,相信每个人对树都很熟悉,不管是柳树、杨树还是桃树,可以说树在我们生活中随处可见;在计算机世界,树是一种分层结构的抽象模型,
如下图所示:
树结构的应用有很多,就比如公司的组织架构,就可以用树来表示,如下图:
除了组织架构,像族谱、省市等都可以使用树结构来表示。
树有很多的术语,如下图:
n=0
时,称为空树;A D H
;树结构可以说是前端中最常见的数据结构之一,比如说DOM树、级联选择、树形组件等等;
JavaScript中并没有提供树这个数据结构,但是我们可以通过对象和数组来模拟一个树,
例如下面这段代码:
const tree = { value: 'A', children: [ { value: 'B', children: [ { value: 'E', children: null }, { value: 'F', children: null }, ], }, { value: 'C', children: [{ value: 'G', children: null }], }, { value: 'D', children: [ { value: 'H', children: null }, { value: 'I', children: null }, ], }, ], }
所谓的深度优先遍历算法,就是尽可能深的去搜索树的分支,它的遍历顺序如下图:
实现思路如下:
children
持续进行深度优先遍历(递归);实现代码如下:
function dfs(root) { console.log(root.value) root.children && root.children.forEach(dfs) // 与下面一致 // if (root.children) { // root.children.forEach(child => { // dfs(child) // }) // } } dfs(tree) // 这个tree就是前面定义的那个树 /* 结果 A B E F C G D H I */
可以看到,和图中的顺序是一致的,也就是说我们的算法没有问题。
所谓的广度优先就是依次访问离根节点近的节点,它的遍历顺序如下图:
实现思路如下:
children
依次入队;实现代码如下:
function bfs(root) { // 1. 新建队列 跟节点入队 const q = [root] // 4 重复执行 while (q.length > 0) { const node = q.shift() // 2 队头出队 console.log(node.value) // 3 队头 children 依次入队 node.children && node.children.forEach(child => { q.push(child) }) } } bfs(tree) /* 结果 A B C D E F G H I */
可以看到,和图中的顺序是一致的,也就是说我们的算法没有问题。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
本文主要介绍了element 穿梭框性能优化,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
这篇文章主要为大家详细介绍了js点击按钮实现图片排序,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
今天给大家分享的是React Hooks使用要注意问题的内容,本文有实例和详细注释供大家参考,对大家理解Hooks的使用有一定的帮助,接下来跟随小编一起看看吧。
本篇文章给大家带来了关于JavaScript中单线程和异步的相关知识,希望对大家有帮助。
javascript的new关键字用法是什么?关于new关键字,大家应该都比较熟悉,这篇文章主要给大家分享构造函数、new操作符和如何实现一个new,小编觉得挺实用的,感兴趣的朋友就继续往下看吧。
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008