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. ios开发 xcode6以上安装Alcatraz管理插件

    在终端上输入如下命令即可完成安装: curl -fsSL https://raw.github.com/supermarin/Alcatraz/master/Scripts/install.sh |  ...

  2. PAT天梯赛L3-005 垃圾箱分布

    题目链接:点击打开链接 大家倒垃圾的时候,都希望垃圾箱距离自己比较近,但是谁都不愿意守着垃圾箱住.所以垃圾箱的位置必须选在到所有居民点的最短距离最长的地方,同时还要保证每个居民点都在距离它一个不太远的 ...

  3. Java基础笔记(十五)——封装(续)static关键字

    static 静态的,用static修饰的成员叫静态成员或类成员.类实例化的所有对象都会共用同一块静态空间.一个对象将值改变,其它对象的值也就随之改变了. 如:public static int pr ...

  4. 默认约束 default

    default :初始值设置,插入记录时,如果没有明确为字段赋值,则自动赋予默认值.  例子:create table tb6(   id int primary key auto_increment ...

  5. Vue 4 -- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用

    一.获取原生的DOM的方式 在js中,我们可以通过id.class或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加ref属性,通过this.$refs获取,如 ...

  6. 09-----JS事件流的概念(重点)

    在学习jQuery的事件之前,大家必须要对JS的事件有所了解.看下文 时间的概念 HTML中与javascript交互是通过事件驱动来实现的,例如鼠标点击事件.页面的滚动事件onscroll等等,可以 ...

  7. Java集合——集合框架Map接口

    1.Map接口 public interface Map<K,V>将键映射到值的对象.一个映射不能包含重复的键:每个键最多只能映射到一个值.  2.HashMap.Hashtable.Tr ...

  8. Java面向对象_静态代理模式

    概念:为其它对象提供一种代理以控制对这个对象的访问.代理模式说白了就是"真实对象"的代表,在访问对象时引入一定程度的间接性,因为这种间接性可以附加多种用途. public clas ...

  9. ElasticSearch最新版本下载地址

    直接访问官方很慢,打不开,找到这个下载方法: ElasticSearch下载地址: https://download.elastic.co/elasticsearch/elasticsearch/el ...

  10. SpringMVC03 ParameterMethodNameResolver(参数方法名称解析器) And XmlViewResolver(视图解析器)

    参数方法名称解析器 1.配置依赖包 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="ht ...