A method of implementing queues and stacks by an array of javascript

Today, in the project, you use JavaScript to implement the queues and stacks in the data structure, and here's a summary.

A brief introduction to queues and stacks

1.1, the basic concept of the queue

Queue: is a set of advanced first Out (FIFO), that is, the first inserted data, first taken out!

As shown in the following illustration:

1.2, the basic concept of the stack

Stack: is a set that supports LIFO (LIFO), that is, the data that is inserted after it is first taken out!

As shown in the following illustration:

Ii. implementing queues and stacks in JavaScript

Implementing queues and Arrays in JavaScript is primarily through arrays, and JS arrays provide the following methods to make it easy to implement queues and stacks:

Shift: Deletes the first element from the array and returns the value of the element.

Unshift: Adds one or more elements to the beginning of the array and returns the new length

Push: Adds an element to the end of the array and returns a new length

Pop: Deletes the last element from the array and returns the value of the element.

2.1, implementation of the queue

The code is as follows

Copy Code

<script type= "Text/javascript" > Create an array to simulate a queue var a=new Array (); Console.log (a); Unshift: Adds one or more elements to the beginning of the array and returns the new length Console.log ("Team"); A.unshift (1) Console.log (a);//----->1 A.unshift (2); Console.log (a);//----->2,1 A.unshift (3); Console.log (a);//----->3,2,1 A.unshift (4); Console.log (a);//----->4,3,2,1 Console.log ("Out team, advanced first Out"); Console.log (a); Pop: Deletes the last element from the array and returns the value of the element A.pop ()//----->1 Console.log (a); A.pop ()//-----&GT;2 Console.log (a); A.pop ()//----->3 Console.log (a); A.pop ()//----->4 Console.log (a); </script>

The results of the output from the Google Browser console are shown in the following illustration:

2.2, implementation stack

The code is as follows

Copy Code

<script type= "Text/javascript" > Create an array to simulate the stack var a=new Array (); Console.log (a); Push: Adds one or more elements to the end of the array and returns the new length Console.log ("Into stack"); A.push (1) Console.log (a);//----->1 A.push (2); Console.log (a);//----->1,2 A.push (3); Console.log (a);//----->1,2,3 A.push (4); Console.log (a);//----->1,2,3,4 Console.log ("Out of the stack, LIFO first"); Console.log (a); Pop: Deletes the last element from the array and returns the value of the element A.pop ()//----->4 Console.log (a); A.pop ()//----->3 Console.log (a); A.pop ()//-----&GT;2 Console.log (a); A.pop ()//----->1 Console.log (a); </script>

The results of the output from the Google Browser console are shown in the following illustration:

2.3. Performance test of Push method and Unshift method

Both the push and Unshift methods of array can add elements to the current array, but the push is added at the end, and the Unshift is added at the beginning, and the principle is that the unshift is less efficient. The reason is that it moves the existing element down one place, each adding an element. But what is the difference in efficiency? Here's a quick test.

The code is as follows

Copy Code

<script type= "Text/javascript" > /* About the code "var s=+newdate ();" The skill description The explanation is as follows: =+ This operator does not exist; + equivalent to. valueof (); +new date () is equivalent to new Date (). valueof () Returns the number of milliseconds for the current time as 4 results Alert (+new Date ()); Alert (+new Date); var s=new Date (); Alert (s.valueof ()); Alert (S.gettime ()); */ var arr = []; var starttime = +new Date (); +new date () is equivalent to new Date (). valueof (), which returns the number of milliseconds in the current time Push performance Test for (var i = 0; i < 100000; i++) { Arr.push (i); } var endtime = +new Date (); Console.log ("Invoke the Push method to add 100,000 elements to the array time consuming" + (Endtime-starttime) + "milliseconds"); StartTime = +new Date (); arr = []; Unshift Performance Test for (var i = 0; i < 100000; i++) { Arr.unshift (i); } Endtime = +new Date (); Console.log ("Calling the Unshift method to add 100,000 elements to an array is time-consuming" + (Endtime-starttime) + "milliseconds"); </script>

This code performs 100,000 push and unshift operations, and runs once in Google Browser, and the resulting results are as shown in the following figure:

It can be seen that unshift is about 100 times times slower than push! Therefore, it is always prudent to use unshift, especially for large arrays. If you have to achieve unshift effect, you can use the array of the reverse method, array reverse method can invert an array. First, the elements to be put into the array with the push to add, and then perform a reverse, it reached the unshift effect. Like what:

The code is as follows

Copy Code

<script type= "Text/javascript" > Create an array to simulate the stack var a=new Array (); To add an element to the end of an array by using the Push method A.push (1) A.push (2); A.push (3); A.push (4); Console.log (the order of elements in the array before the array is reversed); Console.log (a);//----->1,2,3,4 Array has a method called reverse that can invert an array. First, the elements to be put into the array with the push to add, and then perform a reverse, it reached the unshift effect A.reverse ()///Use the reverse method to invert the array Console.log ("Order of elements in array after inversion of array"); Console.log (a); </script>

The results of the output from the Google Browser console are shown in the following illustration:

From the results of the operation, the order of the array elements has been reversed.

2.4, the Reverse method performance test

What about the performance of the reverse, and then test the following:

The code is as follows	Copy Code
<script type= "Text/javascript" > var arr = [], s = +new Date; for (var i = 0; i < 100000; i++) { Arr.push (i); } Call the reverse method to reverse the order of the 100000 elements in the array Arr.reverse (); Console.log ("Call the reverse method reverses the order of the 100000 elements inside the array) time consuming:" + (+new date-s) + "milliseconds"); </script>

The results of the output from the Google Browser console are shown in the following illustration:

It can be seen from the operation effect that the reverse method is very high in performance and can be used safely.

The above is a summary of the queues and stacks implemented in JavaScript through arrays, and a simple test of the performance of the push, unshift, and reverse methods in manipulating large arrays.