ホームページ >ウェブフロントエンド >jsチュートリアル >JSバイナリツリーのpre-order、in-order、post-orderトラバーサルの実装方法
JSバイナリツリーのpre-order、in-order、post-orderトラバーサルの実装方法
- php中世界最好的语言オリジナル
- 2018-04-16 15:23:302110ブラウズ
今回はJSバイナリツリーのpre-order、in-order、post-orderトラバースの実装方法をお届けします。JSバイナリツリーのpre-order、in-order、post-orderの実装における注意点は何ですか。次は実際的なケースです。一度見てみましょう。 以前データ構造を勉強していた時に、バイナリツリーのpre-order、in-order、post-orderトラバーサルの手法を学び、C言語で実装したのが以下の3種類です。バイナリツリーのトラバースの様子をアニメーションの形式で表示します。
走査プロセス全体では依然として再帰的思考が使用されており、その原理は非常に大まかでシンプルです
。 予約注文トラバーサル用の関数:
function preOrder(node){
if(!(node==null)){
pList.push(node);
preOrder(node.firstElementChild);
preOrder(node.lastElementChild);
}
}
順序通りのトラバーサル関数:
function inOrder(node) {
if (!(node == null)) {
inOrder(node.firstElementChild);
pList.push(node);
inOrder(node.lastElementChild);
}
}
事後トラバーサル関数:
function postOrder(node) {
if (!(node == null)) {
postOrder(node.firstElementChild);
postOrder(node.lastElementChild);
pList.push(node);
}
}
色変更機能:
function changeColor(){
var i=0;
pList[i].style.backgroundColor = 'blue';
timer=setInterval(function(argument){
i++;
if(i<pList.length){
pList[i-1].style.backgroundColor="#fff";
pList[i].style.backgroundColor="blue";
}
else{
pList[pList.length-1].style.backgroundColor="#fff";
}
},500)
}コアコードは上記のとおりです。私はもともと深さ優先トラバーサルと幅優先トラバーサルを書きたかったのです。その後、バイナリ ツリーの深さ優先トラバースがプリオーダー トラバースと同じであることが発見されました。木のBFSとDFSについてはまた別の日にまとめたいと思います。
すべてのコードは次のとおりです:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.root{
display: flex;
padding: 20px;
width: 1000px;
height: 300px;border: 1px solid #000000;
margin: 100px auto;
margin-bottom: 10px;
justify-content: space-between;
}
.child_1{
display: flex;
padding: 20px;
width: 450px;
height: 260px;border: 1px solid red;
justify-content: space-between;
}
.child_2{
display: flex;
padding: 20px;
width: 170px;
height: 220px;border: 1px solid green;
justify-content: space-between;
}
.child_3{
display: flex;
padding: 20px;
width: 35px;
height: 180px;border: 1px solid blue;
justify-content: space-between;
}
input{
margin-left: 100px;
width: 60px;
height: 40px;
font:20px italic;
}
</style>
</head>
<body>
<p class="root">
<p class="child_1">
<p class="child_2">
<p class="child_3"></p>
<p class="child_3"></p>
</p>
<p class="child_2">
<p class="child_3"></p>
<p class="child_3"></p>
</p>
</p>
<p class="child_1">
<p class="child_2">
<p class="child_3"></p>
<p class="child_3"></p>
</p>
<p class="child_2">
<p class="child_3"></p>
<p class="child_3"></p>
</p>
</p>
</p>
<input type="button" value="先序">
<input type="button" value="中序">
<input type="button" value="后序">
<script type="text/javascript" src="遍历.js"></script>
</body>
</html>
js:
れぇバイナリ ツリーをたどるという考え方は同じであることがわかります。以前は JS をさまざまな特殊効果を記述するための言語だと考えていましたが、今ではそれは常に単純すぎます。
この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:
タッチイベントでスライド距離の長さを取得する方法JS+H5+C3でポップアップウィンドウを実装する以上がJSバイナリツリーのpre-order、in-order、post-orderトラバーサルの実装方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。