The technique of queue and stack _javascript in the data structure of JavaScript array implementation

Source: Internet
Author: User
Tags javascript array

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

<script type= "Text/javascript" >
//Create an array to simulate the 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 ()
Console.log (a);//----->
a.unshift ();
Console.log (a);//-----,
a.unshift ();
Console.log (a);//-----,
a.unshift ();
Console.log (a);//----->,,,
console.log ("Out of the team, advanced first Out");
Console.log (a);
Pop: Deletes the last element from the array and returns the value of the element
A.pop ()----->
Console.log (a);
A.pop ()//----->
Console.log (a);
A.pop ()//----->
Console.log (a);
A.pop ()//----->
Console.log (a);

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

  

2.2, implementation stack

<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 a new length
console.log ("into stack");
A.push ()
Console.log (a);//----->
a.push ();
Console.log (a);//-----,
a.push ();
Console.log (a);//-----,
a.push ();
Console.log (a);//----->,,,
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 ()----->
Console.log (a);
A.pop ()//----->
Console.log (a);
A.pop ()//----->
Console.log (a);
A.pop ()//----->
Console.log (a);

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 how much efficiency difference is there? Here's a quick test.

<script type= "Text/javascript" >
/* About Code "var s=+newdate ();" The technical explanations are
as follows: =+ This operator does not exist;
+ equivalent to. valueof ();
+new date ()
is the number of milliseconds (
+new date ()
) that returns the current time as a result of new date (). valueof (). Alert (+new Date);
var s=new Date ();
Alert (s.valueof ());
Alert (S.gettime ());
* *
var arr = [];
var starttime = +new Date (); +new Date () is the equivalent of new date (). valueof (), which returns the number of milliseconds
//push performance tests for the current time 
(var i = i < i++) { 
arr.push (i); 
   }
var endtime = +new Date ();
Console.log ("Invoke the Push method to add an element to the array time consuming" + (Endtime-starttime) + "milliseconds"); 
StartTime = +new Date (); 
arr = []; 
Unshift Performance test for 
(var i = i < i++) { 
arr.unshift (i); 
}
Endtime = +new Date ();
Console.log ("Call the Unshift method to add an element to an array is time-consuming" + (Endtime-starttime) + "milliseconds"); 

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:

Visible, Unshift is about 100 times times slower than push! Therefore, usually still should be cautious with 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:

<script type= "Text/javascript" >
//Create an array to simulate the stack
var a=new array ();
Use the Push method to add an element
A.push ()
A.push () to the end of the array;
A.push ();
A.push ();
Console.log (the order of elements in the array before the array is reversed);
Console.log (a);//----->,,,
//array has a method called reverse that can reverse an array. First, the elements to be put into the array with the push to add, and then perform a reverse, the Unshift effect
a.reverse (); Use the reverse method to invert the array
console.log (" The order of the elements in the array after the inversion of the array ");
Console.log (a);

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:

<script type= "Text/javascript" >
var arr = [], s = +new Date; 
for (var i =; I < i++) { 
arr.push (i); 
}
Call the reverse method to reverse the order of the elements inside the array
arr.reverse (); 
Console.log ("Call reverse method to reverse the order of elements inside an array is 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.

The above is a small set of JavaScript to introduce the implementation of the data structure of the queue and stack, hope for everyone to help, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.