JavaScript and javascript in the Tree Structure

JavaScript and javascript in the Tree Structure

Everyone must be familiar with the data structure "Tree". Today, let's review the binary tree and tree in the data structure and use JavaScript to implement them.

Ps: the tree structure is embodied in the front end in many places, such as virtual DOM of Vue and bubble.

Binary Tree

-- Concept --

A binary tree is a tree structure. It features that each node has at most two Subtrees (that is, a node with a degree of no presence greater than 2 in a binary tree, the subtree of a binary tree can be left or right, and its order cannot be reversed.

The following is a binary tree (note: the binary tree is used as an example in the following example ):

There are three common methods to traverse a binary tree:

1) traverse Binary Trees in sequence (left and right)

If the binary tree is empty, the operation is null. Otherwise

-- Access the root node;

-- Traverse the left subtree in sequence;

-- Traverse the right subtree in sequence.

For example, in the preceding example, the result of the binary tree traversal is as follows:

2) traverse a binary tree in the middle order (left root and right)

If the binary tree is empty, the operation is null. Otherwise

-- Traverse the left subtree in the middle order;

-- Access the root node;

-- Traverse the right subtree in the middle order.

For example, in the preceding example, the result of the binary tree traversal is as follows:

3) Post-order traversal of Binary Trees (left and right root)

If the binary tree is empty, the operation is null. Otherwise

-- Traverse the left subtree in descending order;

-- Traverse the right subtree in descending order;

-- Access the root node.

For example, in the preceding example, the result of the binary tree traversal is as follows:

Now that we have learned about Binary Trees and traversal methods, let's use JavaScrip to implement them. Of course, we use a chain storage structure.

First, Using JavaScript constructor to create a binary tree node, as follows:

Function TreeNode () {this. data = null; // data of this node this. lchild = null; // left subtree this. rchild = null; // right subtree };

Then, We can build a binary tree by traversing the binary tree algorithm, as shown below, using the first sequence to create a binary tree method:

/** Method: Create a binary tree using the first sequence * @ params: nodeList (Array)-Tree node, store the binary tree in the first sequence in the Array, and null indicates an empty node */TreeNode. createBiTree = function (nodeList) {var I = 0; return (function getNode () {var node = null, val = nodeList [I ++]; if (! Val) {node = null;} else {node = new TreeNode (); node. data = val; node. lchild = getNode (); node. rchild = getNode () ;}return node ;})();};

LastThat is, traverse a binary tree, including PreOrderTraverse, InOrderTraverse, and PostOrderTraverse:

TreeNode.prototype = { constructor: TreeNode, _PreOrderTraverse: function(node){ if(node){ console.log(node.data); this._PreOrderTraverse(node.lchild); this._PreOrderTraverse(node.rchild); } }, PreOrderTraverse: function(){ console.log('PreOrder:'); this._PreOrderTraverse(this); }, _InOrderTraverse: function(node){ if(node){ this._InOrderTraverse(node.lchild); console.log(node.data); this._InOrderTraverse(node.rchild); } }, InOrderTraverse: function(){ console.log('InOrder:'); this._InOrderTraverse(this); }, _PostOrderTraverse: function(node){ if(node){ this._PostOrderTraverse(node.lchild); this._PostOrderTraverse(node.rchild); console.log(node.data); } }, PostOrderTraverse: function(){ console.log('PostOrder:'); this._PostOrderTraverse(this); }};

Let's test the preceding Binary Tree example:

var treeNode = null, nodeList = ['A', 'B', 'C', null, null, 'D', 'E', null, 'G', null, null, 'F', null, null, null];//getting a binary tree from nodeListtreeNode = TreeNode.createBiTree(nodeList); //traversing the tree of treeNodetreeNode.PreOrderTraverse();//ABCDEGFtreeNode.InOrderTraverse();//CBEGDFAtreeNode.PostOrderTraverse();//CGEFDBA

Tree

-- Concept --

A tree is a finite set of n (n> = 0) nodes. In any non-empty tree, there is only one specific root node. When n> 1, the other nodes can be divided into m (m> 0) A finite set that does not conflict with each other. Each set itself is a tree called the root subtree. Of course, Binary Trees must belong to trees.

The following is a tree (Note: for example, the tree below is used as an example ):

AndTo traverse a multi-child tree. There are two common traversal methods:

1) Root traversal is similar to Depth_First Search traversal. They all use stacks to traverse elements,As follows:

2) traverse by level, similar to Breadth_First Search. They all use queues to traverse elements., As follows:

Now that we know about the tree and the Traversal method, let's use JavaScrip to implement it. Of course, the chain storage structure is also used.

First, create a tree node using JavaScript, as shown below:

/** @ Params: data -- node data children -- all children nodes */function TreeNode (data, children) {if (! (This instanceof TreeNode) {return new TreeNode (data, children);} this. data = data | null; this. children = children | [];};

Based on the above TreeNode constructor, we can represent the tree in the example as follows:

var treeNode = TreeNode('A', [ TreeNode('B', [TreeNode('E')]), TreeNode('C'), TreeNode('D') ]);

The next step is to write the traversal tree method, namely, root traversal and hierarchical traversal, as shown below:

TreeNode. prototype = {constructor: TreeNode, _ traverseAsDFS: function (node) {// first traverse var self = this; if (node) {console. log (node. data); node. children. forEach (function (child) {if (child. children. length) {self. _ traverseAsDFS (child);} else {console. log (child. data) ;}}) ;}}, traverseAsDFS: function () {console. log ('dest_first search'); this. _ traverseAsDFS (this) ;}, traverseAsBFS: function () {// traverse var queue by hierarchy = []; console. log ('breadth _ First search'); console. log (this. data); if (this. children. length) {queue. push (this);} while (queue. length) {let tempNode = queue. shift (); tempNode. children. forEach (function (child) {console. log (child. data); if (child. children. length) {queue. push (child );}});}}};

Let's test the preceding Binary Tree example:

var treeNode = TreeNode('A', [ TreeNode('B', [TreeNode('E')]), TreeNode('C'), TreeNode('D') ]);treeNode.traverseAsDFS();//ABECDtreeNode.traverseAsBFS();//ABCDE

For all the above Code, see github.

The above is all the content of this article. I hope this article will help you in your study or work. I also hope to provide more support to the customer's home!