【经典回放】多种语言系列数据结构算法：二叉树（JavaScript版）

1 二叉树类的设计以及二叉树遍历

要完成二叉树的类设计，最好把链表下的Node.js复制过来，相比链表的结点，二叉树仅仅是多了一个结点指针而已。略加修改后，就是：

function TNODE(DATA)
{
this.Data=DATA;
this.lChild=null;
this.rChild=null;
this.SetLChild=function (LCHILD){this.lChild=LCHILD;}
this.GetLChild=function (){return this.lChild;}
this.SetRChild=function (RCHILD){this.rChild=RCHILD;}
this.GetRChild=function (){return this.rChild;}
this.GetData=function (){return this.Data;}
}

在这个类中，用：

SetLChild()、GetLChild()  两个方法来设置、读出该结点的左孩子；

SetRChild()、GetRChild()  两个方法来设置、读出该结点的右孩子；

SetData()、GetData()     两个方法来设置、读出该结点的数值。

要测试这个类，也很容易，注意再次复制二叉树下的a1.html，略加修改就是：

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>二叉树测试程序</title><SCRIPT TYPE="TEXT/JAVASCRIPT" src="TNode0.js"></SCRIPT><script type="text/javascript">function Trav(T){var s;if(T==undefined||T==null) return;Trav(T.GetLChild());document.write(T.GetData()+'<br>');Trav(T.GetRChild());}function fun(){var A='AA';var B='BB';var C='CC';var D='DD';var TA=new TNODE(A);var TB=new TNODE(B);var TC=new TNODE(C);var TD=new TNODE(D);TA.SetLChild(TB);TA.SetRChild(TC);TB.SetRChild(TD);		Trav(TA);}</script></head><body bgcolor="#FFFFFF"><div><input type="button" id=BUTTON1 value="开始测试" onclick='fun()'/></div></body>
</html>

注意这个程序的第5行，一定要加载TNode0.js，否则无法构造二叉树。

第7到14行是一个典型的递归二叉树遍历，其中第12行打印遍历结果的语句，说明它是按中序遍历打印结果的。

第15开始的函数fun()，是构造一个简单的二叉树，然后在第27行进行遍历。

从程序本身而言，没有任何复杂的地方，直接点开T1.html就显示了结果。

2 IE8下JavaScript程序的调试

JavaScript编程，最大的麻烦是缺乏一个好的编程平台，往往这类简单的程序，都是在记事本这样的程序里编写的，但必要的调试手段还是需要的。目前，很多浏览器都自己带有JavaScrip程序调试工具，比较常用的有两种：IE8、Chrome两种浏览器。IE8是WINDOWS系统默认的浏览器，而谷歌的Chrome则非常小，并且功能异常强大，我们下面先看在IE8下如何调试JvaaScrip程序。

用IE8打开T1.HTML文件，然后点开菜单：工具->开发人员工具，就是：

图 1

则显示下面的界面：

图 2

注意按下选项卡：脚本，如图3，就会看到我们的程序。

 

图 3

注意看上面的按钮：启动调试，鼠标按下该按钮。然后看左边程序行号，选第17行的“17”位置处、鼠标点下，就是这样的结果：

图 4

这个功能是给该行上加上断点，所谓断点就是程序运行到这里要停止下来，做完这些工作后，回到浏览器界面里，按下网页上按钮：开始测试，让程序开始运行，此时程序会跳到上述加断点的位置处、并停下来，就是：

图 5

注意此时的界面，它分割成两个部分，按下右边界面的按钮：局部变量，有：

图 6

如果按下F10、F11（含义同VC一致），会逐个语句执行并看到结果，如：

图 7

从图7我们可以看到这些变量的结果确实是我们所要的。按F11逐步进Trav()函数，就会看到这个树的遍历情况。

谷歌浏览器chrome的调试过程和IE8差别不大，仅仅是界面有差异，由于谷歌浏览器并没有IE8浏览器的文件打开菜单，所以你可以用鼠标点中T1.HTML文件，直接拖进浏览器界面里即可，注意谷歌浏览器的调试功能是在：

图 8

  该功能隐藏很深，但功能确实不错。值得注意的是谷歌浏览器支持HTML5，而IE8则不支持。

学会浏览器下调试JavaScript的另一个好处是：你可以直接对一个网站的程序进行这样的调试，这在过去是不能想象的事情。由于有了这样的功能，一度让很多网站的安全防护遭到解破，但很快，相当数量的网站其安全体系也有了质的飞跃，所以一个工具本身的好坏是很难评价的，但总体说来：勤奋者手中有好的工具、那么好处是显而易见的事情。

3 复杂数据类型对象的二叉树构造以及遍历

对JavaScrip这样的计算机语言而言，它的变量本身没有什么特定的类型概念，所以本身就是泛型的，但我们还是做一个结点数据类型复杂的二叉树来完成一个实验。

复制链表下的ElemType.js过来，这个类是：

function ElemType(SNO,SNAME,SAGE)
{this.sNo=SNO;this.sName=SNAME;this.sAge=SAGE;this.GetSNO=function(){return this.sNo;}this.GetSNAME=function(){return this.sName;}this.GetSAGE=function(){return this.sAge;}
}

这个类虽然简单但也有合适的数据类型。为此，我们就要修改T1.html中结点的数据，就是这样的：

                   var A=new ElemType(20102000,'A',19);

                   var B=new ElemType(20102001,'B',20);

                   var C=new ElemType(20102002,'C',21);

                   var D=new ElemType(20102003,'D',22);

然后和T1.HEML一样，完成一个简单的二叉树，就是：

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>二叉树测试程序</title><SCRIPT TYPE="TEXT/JAVASCRIPT" src="ElemType.js"></SCRIPT><SCRIPT TYPE="TEXT/JAVASCRIPT" src="TNode0.js"></SCRIPT><script type="text/javascript">function Trav(T){var s;if(T==undefined||T==null) return;Trav(T.GetLChild());s=T.GetData();document.write(s.GetSNO()+'  '+s.GetSNAME()+'  '+s.GetSAGE()+'<br>');Trav(T.GetRChild());}function fun(){var A=new ElemType(20102000,'A',19);var B=new ElemType(20102001,'B',20);var C=new ElemType(20102002,'C',21);var D=new ElemType(20102003,'D',22);var TA=new TNODE(A);var TB=new TNODE(B);var TC=new TNODE(C);var TD=new TNODE(D);TA.SetLChild(TB);TA.SetRChild(TC);TB.SetRChild(TD);		Trav(TA);}</script></head><body bgcolor="#FFFFFF"><div><input type="button" id=BUTTON1 value="开始测试" onclick='fun()'/></div></body>
</html>

表4 复杂数据类型的二叉树遍历，见T2.html

注意上面程序的变更：

第5行：要引用ElemType.js，否则我们没办法构造学生类型数据；

由于JavaScript的数据类型本身就是泛型，所以二叉树类不需要任何修改。

第8行开始的遍历函数Trav()，由于每个结点类型成为ElemType这样的三列数据，所以要显示一行就必须把三列分开显示，如第14行。运行T2.html，会看到这个树的遍历结果。

4 回调模式传输遍历结果

在C#下dt.c已经显示了这个技术的全貌，这样的递归函数就是这样的；

function Trav(T,preTrav,inTrav,posTrav)
{if(T==undefined||T==null) return;if(!(preTrav==undefined||preTrav==null)) preTrav(T);Trav(T.GetLChild(),preTrav,inTrav,posTrav);if(!(inTrav==undefined||inTrav==null)) inTrav(T);Trav(T.GetRChild(),preTrav,inTrav,posTrav);if(!(posTrav==undefined||posTrav==null)) posTrav(T);
}

在这个函数里，参数:

T：      遍历中二叉树的结点对象；

preTrav：先序遍历处理函数；

inTrav： 中序遍历处理函数；

posTrav：后序遍历处理函数；

把这个函数写进二叉树类中，全部就是：

function TNODE(DATA)
{
this.Data=DATA;
this.lChild=null;
this.rChild=null;
this.SetLChild=function (LCHILD){this.lChild=LCHILD;}
this.GetLChild=function (){return this.lChild;}
this.SetRChild=function (RCHILD){this.rChild=RCHILD;}
this.GetRChild=function (){return this.rChild;}
this.GetData=function (){return this.Data;}
function Trav(T,preTrav,inTrav,posTrav)
{if(T==undefined||T==null) return;if(!(preTrav==undefined||preTrav==null)) preTrav(T);Trav(T.GetLChild(),preTrav,inTrav,posTrav);if(!(inTrav==undefined||inTrav==null)) inTrav(T);Trav(T.GetRChild(),preTrav,inTrav,posTrav);if(!(posTrav==undefined||posTrav==null)) posTrav(T);
}
this.Traverse=function(preTrav,inTrav,posTrav){Trav(this,preTrav,inTrav,posTrav);}
}

注意这个类是在文件TNode1.js中。为了测试这个类，编写网页程序如下：

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>二叉树测试程序</title><SCRIPT TYPE="TEXT/JAVASCRIPT" src="TNode1.js"></SCRIPT><script type="text/javascript">function P1(T){document.write(T.GetData()+'<br>');}function fun(){var A='AA';var B='BB';var C='CC';var D='DD';var TA=new TNODE(A);var TB=new TNODE(B);var TC=new TNODE(C);var TD=new TNODE(D);TA.SetLChild(TB);TA.SetRChild(TC);TB.SetRChild(TD);		TA.Traverse(P1,null,null);}</script></head><body bgcolor="#FFFFFF"><div><input type="button" id=BUTTON1 value="开始测试" onclick='fun()'/></div></body>
</html>

注意第7行，这个函数P1()仅仅是打印结点的值，注意在第24行，TA结点的遍历用P1作为实参传递给遍历函数，这样，这个网页会打印出二叉树的先序遍历结果。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/287084.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Fiddler之解决https链接返回数据显示乱码问题

Fiddler之解决https链接返回数据显示乱码问题

1 、问题 我网页访问淘宝&#xff0c;然后F12查看关键链接&#xff0c;返回的数据里面有json各式的数据&#xff0c;然后我通过关键字在Fiddler里面找到链接&#xff0c;然后查看返回的内容是乱码。 2 、解决办法 然后这样设置&#xff0c;再去查看SyntaxView或者Raw都可以看到…
阅读更多...
android上传图片被旋转,input上传照片旋转解决办法

android上传图片被旋转,input上传照片旋转解决办法

需求很简单&#xff1a;h5拍照上传照片&#xff0c;然后显示出来问题在&#xff1a;上传之后的图片在PC&#xff0c;IOS端均能正常显示&#xff0c;Android端显示的则是被旋转90度的。直接上代码下面这个方法传入file对象&#xff0c;然后会去除掉照片中的exIf信息&#xff0c;…
阅读更多...
（12）python 的列表我从没想过会那么好用

（12）python 的列表我从没想过会那么好用

本系列文章将会以通俗易懂的对话方式进行教学&#xff0c;对话中将涵盖了新手在学习中的一般问题。此系列将会持续更新&#xff0c;包括别的语言以及实战都将使用对话的方式进行教学&#xff0c;基础编程语言教学适用于零基础小白&#xff0c;之后实战课程也将会逐步更新。 若…
阅读更多...
如何优雅的跨 Namespace 同步 Secret 和 ConfigMap？

如何优雅的跨 Namespace 同步 Secret 和 ConfigMap？

Secret 和 ConfigMap 资源对象是命名空间级别的。它们只能被同一命名空间中的 Pod 引用。所以有时候不得不手动为每个命名空间创建它们。但有很多场景&#xff0c;我们想让它们是全局的&#xff0c;至少可以是跨命名空间共享的 Secret 和 ConfigMap&#xff0c;例如这些场景&am…
阅读更多...
定量遥感：计算地方时和太阳高度角（C++代码）

定量遥感：计算地方时和太阳高度角（C++代码）

在定量遥感中，通常需要计算地方时和太阳高度角，本文采用C++语言实现。 #include <cmath> #include <iostream> #include <fstream> using namespace std; void main() {int JD,NF,Y,R,s[5],F[5];float JF,WD;float N0;ifstream data1("d:\\result\\da…
阅读更多...
html5 语义化标签

html5 语义化标签

html5 语义化标签 在HTML 5出来之前&#xff0c;我们用div来表示页面章节&#xff0c;但是这些div都没有实际意义。&#xff08;即使我们用css样式的id和class形容这块内容的意义&#xff09;。这些标签只是我们提供给浏览器的指令&#xff0c;只是定义一个网页的某些部分。但…
阅读更多...
Android之实现首尾带圆角的多颜色水平条

Android之实现首尾带圆角的多颜色水平条

1 效果图 3 代码实现 这里我们采用PercentRelativeLayout布局，首尾我们用半圆shape实现，代码如下 color.xml <color name="progress_first">#1ebBd5</color><color name="progress_second">#f36f53</color><color name=&…
阅读更多...
setAutoCommit(false)导致读不到数据

setAutoCommit(false)导致读不到数据

如果把Connection的AutoCommit设为False,两次executeQuery之间&#xff0c;通过其它途径&#xff08;我通过Navicat&#xff09;修改了status值为1&#xff0c;第二次executeQuery依然把那条数据读出来了&#xff0c;也就是说&#xff0c;我在Navicat中的操作就像没有发生一样&…
阅读更多...
log4j简介及应用

log4j简介及应用

一、介绍 Log4j是Apache的一个开放源代码项目&#xff0c;通过使用Log4j&#xff0c;我们可以控制日志信息输送的目的地是控制台、文件、GUI组件、甚至是套接口服务 器、NT的事件记录器、UNIX Syslog守护进程等&#xff1b;我们也可以控制每一条日志的输出格式&#xff1b;通过…
阅读更多...
（9）有一些人在学习编程的时候总以为代码是死板的

（9）有一些人在学习编程的时候总以为代码是死板的

本系列文章将会以通俗易懂的对话方式进行教学&#xff0c;对话中将涵盖了新手在学习中的一般问题。此系列将会持续更新&#xff0c;包括别的语言以及实战都将使用对话的方式进行教学&#xff0c;基础编程语言教学适用于零基础小白&#xff0c;之后实战课程也将会逐步更新。 若…
阅读更多...
GPS实验一：GPS手持机的使用

GPS实验一：GPS手持机的使用

一、实习目的 了解GPS手持机的使用 二、实习内容 了解GPS手持机的功能和相关操作 三、实习地点 选择视野开阔的场所，方便接受卫星信号。 四、实习工具 GPS接收机是一款手持型的个人导航设备，它可以利用GPS卫星星座计算出当前的位置。其主要图标有：OUT/IN（放大/缩小）、N…
阅读更多...
.NET性能优化-推荐使用Collections.Pooled

.NET性能优化-推荐使用Collections.Pooled

简介性能优化就是如何在保证处理相同数量的请求情况下占用更少的资源&#xff0c;而这个资源一般就是CPU或者内存&#xff0c;当然还有操作系统IO句柄、网络流量、磁盘占用等等。但是绝大多数时候&#xff0c;我们就是在降低CPU和内存的占用率。之前分享的内容都有一些局限性&a…
阅读更多...
Android之PC浏览器上传表单格式大文件到手机客户端read函数阻塞问题

Android之PC浏览器上传表单格式大文件到手机客户端read函数阻塞问题

1 、问题 PC浏览器上传表单格式大文件到手机服务器端，然后read文件真实数据时候出现阻塞。 比如 User-Agent: PostmanRuntime/7.26.1Accept: */*Cache-Control: no-cachePostman-Token: c7e5e240-4398-4ac6-ba7f-98e99b5b4a01Host: 10.15.42.180:9999Accept-Encoding: gzip,…
阅读更多...
避免活跃性危险（第十章）

避免活跃性危险（第十章）

2019独角兽企业重金招聘Python工程师标准>>> 避免活跃性危险 在安全性与活跃性之间通常存在着某种制衡&#xff0c;我们使用加锁机制来确保线程安全&#xff0c;但如果过度地使用加锁&#xff0c;则可能导致“锁顺序死锁”。同样&#xff0c;我们使用线程池和信号量…
阅读更多...
[poj2446]Chessboard

[poj2446]Chessboard

Description 给定一个mn的棋盘&#xff0c;上面有k个洞&#xff0c;求是否能在不重复覆盖且不覆盖到洞的情况下&#xff0c;用21的卡片完全覆盖棋盘。 Input 第一行有三个整数n,m,k(0<m,n<32, 0<k<mn)&#xff0c;m表示行数&#xff0c;n表示列数。 接下来k行&…
阅读更多...
Ubuntu下编译内核

Ubuntu下编译内核

一、下载源代码和编译软件的准备 下载内核源代码&#xff1a;http://www.kernel.org/ 注意&#xff0c;点击2.6.25内核的F版&#xff0c;即完整版。 如果你懒得去网站点联接&#xff0c;运行下列命令&#xff1a; 代码:$cd ~$ wget http://www.kernel.org/pub/linux/kernel/v2.…
阅读更多...
（10）C#偷懒的开始永无止境的循环？

（10）C#偷懒的开始永无止境的循环？

本系列文章将会以通俗易懂的对话方式进行教学&#xff0c;对话中将涵盖了新手在学习中的一般问题。此系列将会持续更新&#xff0c;包括别的语言以及实战都将使用对话的方式进行教学&#xff0c;基础编程语言教学适用于零基础小白&#xff0c;之后实战课程也将会逐步更新。 若…
阅读更多...
活照片 android,活照片app安卓

活照片 android,活照片app安卓

活照片app是当前国内一款最新的图片处理应用软件&#xff0c;能帮助大家快速进行最新的手机拍照、处理功能&#xff0c;当前活照片app已经推出了安卓、苹果版本&#xff0c;可以帮助大家一键修图&#xff0c;将你的图片变得更加有趣。活照片app功能&#xff1a;它可以让你的照片…
阅读更多...
Jwt隐藏大坑，通过源码揭秘

Jwt隐藏大坑，通过源码揭秘

前言JWT是目前最为流行的接口认证方案之一&#xff0c;有关JWT协议的详细内容&#xff0c;请参考&#xff1a;https://jwt.io/introduction今天分享一下在使用JWT在项目中遇到的一个问题&#xff0c;主要是一个协议的细节&#xff0c;非常容易被忽略&#xff0c;如果不是自己遇…
阅读更多...
GPS实验二：GPS接收机的使用

GPS实验二：GPS接收机的使用

一、实习目的 1、了解GPS接收机的基本结构； 2、掌握GPS接收机的一般操作方法。 二、实习内容 1、了解GPS接收机的外观及主要构成单元； 2、学习GPS接收机的安装及静态测量的操作方法； 3、了解GPS接收机工作时的基本状态信息。 三、实习地点 选择视野开阔的场所，视场…
阅读更多...
最新文章

Copyright @ 2022~2023