javascript实现二叉树遍历的代码


Posted in Javascript onJune 08, 2017

前言:

紧接着上篇 二叉树的javascript实现 ,来说一下二叉树的遍历。

本次一本正经的胡说八道,以以下这个二叉树为例子进行遍历:

javascript实现二叉树遍历的代码

接着是要引入二叉树实现的代码:

function Node(data, left, right) {
  this.data = data;
  this.left = left;
  this.right = right;
  this.show = show;
}
function show() {
  return this.data;
}

function BST() {
  this.root = null;
  this.insert = insert;
}
function insert(data) {
  var n = new Node(data, null, null);
  if (this.root == null) {
   this.root = n;
  }
  else {
   var current = this.root;
   var parent;
   while (true) {
     parent = current;
     if (data < current.data) {
      current = current.left;
      if (current == null) {
        parent.left = n;
        break;
      }
     }
     else {
      current = current.right;
      if (current == null) {
        parent.right = n;
        break;
      }
     }
   }
  }
}

二叉树遍历的分类

二叉树的遍历分为先序、中序、后序遍历。这里说到的先序、中序、后序是相对于父节点来说。父节点的值先输出就是先序,三者间它在中间输出就是中序,最后输出就是后序。至于那个是父节点是相对而言的,因为除了叶子节点(最底下一层节点),其他每个节点都可以是父节点。

javascript实现二叉树遍历的代码

先序遍历

先序遍历就是,先打印父节点,然后是左子节点(左子树),然后再打印右子节点(子树)。

function preOrder(node) {
  if (!(node == null)) {
   console.log(node.show() + " ");
   preOrder(node.left);
   preOrder(node.right);
  }
}

// 给BST类添加先序遍历的成员方法
function BST() {
  this.root = null;
  this.insert = insert;
  this.preOrder = preOrder;
}

preOrder函数是递归实现的,应该说二叉树的遍历都是递归实现的。可能有些人会因为先序遍历的特征:“先打印父节点,然后是左子节点(左子树),然后再打印右子节点(子树)” 而陷入一个错误的想法,这想法是什么请看下图:

javascript实现二叉树遍历的代码

注意红框部分,父节点是10,左子节点是3,右子节点是18,因为上面的结论,可能会错误地认为打印的顺序是10 → 3 → 18,然而事实并非如此[捂脸],真是的顺序是:先打印10,然后是打印左子树,打印完左子树的全部节点后,才开始打印以10位父节点的右子树:

javascript实现二叉树遍历的代码

这个时候,你的脑海就该这样想:

javascript实现二叉树遍历的代码

然后是这样想:

javascript实现二叉树遍历的代码

如此类推打印完以10为父节点的左子树,然后也是以这样的方式打印以10为父节点的右子树,按着这种 拆分代替的思想 来理解会更好明白二叉树的遍历。

然后最终,先序遍历改二叉树的顺序是:

javascript实现二叉树遍历的代码

按图的输出顺序是:10 -> 3 -> 2 -> 4 -> 9 -> 8 -> 9 -> 18 -> 13 -> 21

最后来实践一下,先序遍历:

var bst = new BST();
var nums = [10, 3, 18, 2, 4, 13, 21, 9, 8, 9];
for(var i = 0; i < nums.length; i++) {
  bst.insert(nums[i]);
}
bst.preOrder(bst.root);

javascript实现二叉树遍历的代码

这里强调一下,输出顺序和插入顺序有关的,因为你插入顺序不同生成的二叉树也是不同的。有疑问的可以去 二叉树的javascript实现 细看一下,有比较明白的说明了二叉树,也可以实验一下:

javascript实现二叉树遍历的代码

中序遍历

看完先序遍历,已经可以类推到很多和中序、后序遍历相关的知识点。中序遍历的特征是:先打印左子树(左子节点),接着打印父节点,最后打印右子树(右子节点)。

function inOrder(node) {
  if (!(node == null)) {
   inOrder(node.left);
   console.log(node.show() + " ");
   inOrder(node.right);
  }
}

// 给BST类添加该成员方法
function BST() {
  this.root = null;
  this.insert = insert;
  this.preOrder = preOrder;
  this.inOrder = inOrder;
}

中序遍历的打印顺序:

javascript实现二叉树遍历的代码

按上图的输出顺序是:2 -> 3 -> 4 -> 8 -> 9 -> 9 -> 10 -> 13 -> 18 -> 21

接着是,实践一下中序遍历:

javascript实现二叉树遍历的代码

后序遍历

function postOrder(node) {
  if (!(node == null)) {
   postOrder(node.left);
   postOrder(node.right);
   console.log(node.show() + " ");
  }
}

// 给BST类添加该成员方法
function BST() {
  this.root = null;
  this.insert = insert;
  this.preOrder = preOrder;
  this.inOrder = inOrder;
  this.postOrder = postOrder;
}

后序遍历的打印顺序

javascript实现二叉树遍历的代码

按上图的输出顺序是:2 -> 8 -> 9 -> 9 -> 4 -> 3 -> 13 -> 21 -> 18  -> 10

javascript实现二叉树遍历的代码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript下利用arguments实现string.format函数
Aug 24 Javascript
Script标签与访问HTML页面详解
Jan 10 Javascript
jQuery scroll事件实现监控滚动条分页示例
Apr 04 Javascript
JavaScript时间转换处理函数
Apr 14 Javascript
浅谈关于JavaScript API设计的一些建议和准则
Jun 24 Javascript
DWR3 访问WEB元素的两种方法实例详解
Jan 03 Javascript
基于vue实现分页/翻页组件paginator示例
Mar 09 Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 Javascript
详解ES7 Decorator 入门解析
Feb 18 Javascript
jQuery zTree插件快速实现目录树
Aug 16 jQuery
解决vue刷新页面以后丢失store的数据问题
Aug 11 Javascript
Vue用mixin合并重复代码的实现
Nov 27 Vue.js
微信小程序tabbar不显示解决办法
Jun 08 #Javascript
javascript实现二叉树的代码
Jun 08 #Javascript
微信小程序搜索组件wxSearch实例详解
Jun 08 #Javascript
JS去掉字符串前后空格、阻止表单提交的实现代码
Jun 08 #Javascript
angular实现图片懒加载实例代码
Jun 08 #Javascript
微信小程序日历组件calendar详解及实例
Jun 08 #Javascript
php简单数据库操作类的封装
Jun 08 #Javascript
You might like
php读取3389的脚本
2014/05/06 PHP
PHP采用XML-RPC构造Web Service实例教程
2014/07/16 PHP
php文件上传的两种实现方法
2016/04/04 PHP
Laravel框架路由管理简单示例
2019/05/07 PHP
javascript对象的property和prototype是这样一种关系
2007/03/24 Javascript
event对象的方法 兼容多浏览器
2009/06/27 Javascript
IE8 下的Js错误HTML Parsing Error...
2009/08/14 Javascript
JavaScript获取当前页面上的指定对象示例代码
2014/02/28 Javascript
HTML Table 空白单元格补全的简单实现
2016/10/13 Javascript
vue loadmore组件上拉加载更多功能示例代码
2017/07/19 Javascript
Bootstrap table使用方法记录
2017/08/23 Javascript
利用vue + koa2 + mockjs模拟数据的方法教程
2017/11/22 Javascript
微信小程序简单实现form表单获取输入数据功能示例
2017/11/30 Javascript
Vue实现一个无限加载列表功能
2018/11/13 Javascript
vue+express+jwt持久化登录的方法
2019/06/14 Javascript
简单了解vue中的v-if和v-show的区别
2019/10/08 Javascript
JavaScript实现猜数字游戏
2020/05/20 Javascript
Python中用函数作为返回值和实现闭包的教程
2015/04/27 Python
在windows系统中实现python3安装lxml
2016/03/23 Python
使用Python写CUDA程序的方法
2017/03/27 Python
Python装饰器知识点补充
2018/05/28 Python
python遍历文件夹,指定遍历深度与忽略目录的方法
2018/07/11 Python
python抓取搜狗微信公众号文章
2019/04/01 Python
关于Theano和Tensorflow多GPU使用问题
2020/06/19 Python
基于Python下载网络图片方法汇总代码实例
2020/06/24 Python
Python3如何使用多线程升程序运行速度
2020/08/11 Python
HTML5无刷新改变当前url的代码
2017/03/15 HTML / CSS
27个经典Linux面试题及答案,你知道几个?
2014/03/11 面试题
电气工程及其自动化学生实习自我鉴定
2013/09/19 职场文书
摄影专业毕业生求职信
2014/03/13 职场文书
高中英语演讲稿范文
2014/04/24 职场文书
保洁公司服务承诺书
2014/05/28 职场文书
商务英语专业求职信
2014/06/26 职场文书
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python
Nginx location 和 proxy_pass路径配置问题小结
2021/09/04 Servers
Redis Stream类型的使用详解
2021/11/11 Redis