1、深度遍历

深度遍历利用栈来实现

class Stack {

    constructor () {
this.top = 0, // 栈的长度
this.list = []
} push(item) {
this.top++;
this.list.push(item) // 入栈操作
} pop () {
--this.top;
return this.list.pop() // 出栈操作
} peek () {
return this.list[this.top -1] // 查询栈顶元素
} } let treeData = {
id: 0,
name: '00',
children: [
{
id: 1,
name: '01',
children: [
{
id: 11,
name: '11',
children: []
}]
},
{
id: 2,
name: '02',
children: [
{
id: 22,
name: '22',
children: []
}]
}]
} function formatTreeData(data) {
let stack = new Stack()
stack.push(data);
while(stack.top) {
let item = stack.pop()
for (let i in item.children) {
stack.push(item.children[i])
}
console.log(item.id)
}
}
formatTreeData(treeData)

2、广度遍历

广度遍历利用队列来实现

class Queue {

    constructor () {
this.top = 0, // 栈的长度
this.list = []
} push(item) {
this.top++;
this.list.push(item) // 入栈操作
} shift() {
--this.top;
return this.list.shift() // 出栈操作
} peek () {
return this.list[this.top -1] // 查询栈顶元素
} } let treeData = {
id: 0,
name: '00',
children: [
{
id: 1,
name: '01',
children: [
{
id: 11,
name: '11',
children: []
}]
},
{
id: 2,
name: '02',
children: [
{
id: 22,
name: '22',
children: []
}]
}]
} function formatTreeData(data) {
let queue = new Queue()
queue.push(data);
while(queue.top) {
let item = queue.shift()
for (let i in item.children) {
queue.push(item.children[i])
}
console.log(item.id)
}
}
formatTreeData(treeData)

js数据结构处理--------树结构数据遍历的更多相关文章

  1. js 树结构数据遍历条件判断

    代码: /** * 树结构数据条件过滤 * js 指定删除数组(树结构数据) */ function filter (data, id) { var newData = data.filter(x = ...

  2. js数据结构处理--------扁平化数组处理为树结构数据

    将扁平化的数组处理为树结构数据,我们可以利用对象来处理,对象的复制是浅拷贝,指向相同的内存地址: var arr = [ { id: 0, pid: -1, name: 'sadas' }, { id ...

  3. js 递归树结构数据查找父级

    1.json树数据查找所有父级--完成 json:树结构数据 var arrData = [{ "label": "中国", "City": ...

  4. Vue.js与angular在数据实现的思考

    Vue.js,其简洁的API以及活跃的社区,对于打算从angular转向Vue还是挺友好的,打算最近一段时间去整理下Vue自己的一些思考,加深下对于此的印象. Vue与Angular同属于MVVM框架 ...

  5. AngularJS集合数据遍历显示

    AngularJS集合数据遍历显示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

  6. legend2---开发日志6(后端和前端如何相互配合(比如php,js,元素状态和数据改变))

    legend2---开发日志6(后端和前端如何相互配合(比如php,js,元素状态和数据改变)) 一.总结 一句话总结:php给元素初始状态,js根据这个状态做初始化和后续变化,使用vue真的很方便( ...

  7. javascript数据结构与算法--二叉树遍历(后序)

    javascript数据结构与算法--二叉树遍历(后序) 后序遍历先访问叶子节点,从左子树到右子树,再到根节点. /* *二叉树中,相对较小的值保存在左节点上,较大的值保存在右节点中 * * * */ ...

  8. javascript数据结构与算法--二叉树遍历(先序)

    javascript数据结构与算法--二叉树遍历(先序) 先序遍历先访问根节点, 然后以同样方式访问左子树和右子树 代码如下: /* *二叉树中,相对较小的值保存在左节点上,较大的值保存在右节点中 * ...

  9. javascript数据结构与算法--二叉树遍历(中序)

    javascript数据结构与算法--二叉树遍历(中序) 中序遍历按照节点上的键值,以升序访问BST上的所有节点 代码如下: /* *二叉树中,相对较小的值保存在左节点上,较大的值保存在右节点中 * ...

随机推荐

  1. final、权限、内部类

    final.权限.内部类 final.权限.内部类 final.权限.内部类 final.权限.内部类 final.权限.内部类 final.权限.内部类

  2. Start and Stop Bitbucket Server

    Starting and stopping Bitbucket Server This page describes the various ways you can start or stop Bi ...

  3. 操作iframe的一些方法

    //父页面操作iframe里的内容 oInput.onclick=function(){ var oBox = oIframe.contentWindow.document.getElementByI ...

  4. flush logs时做的操作

    flush logs时做的操作:  对于一般查询日志和慢日志,先关闭文件再打开  对于binlog,关闭当前的,开始用下一个新的  用错误日志文件的话,先关闭再打开flush logs可以对一般查询日 ...

  5. Murano中的角色

    Application Publisher - An individual or company that publishes an application to an application cat ...

  6. JS绑定事件和移除事件的处理方法

    addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作.所有的DOM节点中都包含这两种方法,并且它们都接受3个参数:要处理的事件名.作为事件 ...

  7. java打印堆栈信息

    StackTraceElement[] stackElements = new Throwable().getStackTrace(); if(stackElements != null){ for( ...

  8. Spring之Quartz定时任务和Cron表达式详解

    1.定时业务逻辑类 public class ExpireJobTask { /** Logger */ private static final Logger logger = LoggerFact ...

  9. javascript实现多线程提升项目加载速度

    以前大家都认为js是单线程执行的,假如我们要执行一些耗时的操作,比如加载一张很大的图片,我们可能需要一个进度条来让用户进行等待,在等待的过程中,整个js线程会被阻塞,后面的代码不能正常运行,这可能大大 ...

  10. concurrent.futures模块与协程

    concurrent.futures  —Launching parallel tasks    concurrent.futures模块同时提供了进程池和线程池,它是将来的使用趋势,同样我们之前学习 ...