Home » JavaScript » Javascript Array Push Example

About Era Balliu

Era is a Telecommunications Engineering student, with a great passion for new technologies. Up until now she has been coding with HTML/CSS, Bootstrap and other front-end coding languages and frameworks, and her recent love is Angular JS.

Javascript Array Push Example

There are times when you’ve been coding for too long and you don’t remember where exactly did you initialize your array type variable. If you’re too lazy or too strapped for time to search for it and add another element, then you have the means to do that right then and there, without any effort. The following shows you how.
 
 
 
 
 
 
 
 

The push() method

The push() method appends elements after the ones with the largest index, at the end of the array. It can take single elements, or multiple ones and add them to the initial one. The code snippet below shows you how this is done:

/* initial array */
var data = [ "X" ];

/* first addition */
data.push( "A" );

/* second addition */
data.push( "B", "C" );

/* result */
console.log( data );

/* output: X A B C */

So, first we had an array with only one element. Then, using the push() function we have added one element, bringing the array into X A. After that, we have added two more elements, bringin the array to this: X A B C.

Note that the push() method can even take a whole array as an argument, but it wouldn’t append it’s elements to the existing array, rather than put the second array as a last element, known also as a nested array. For appending one array’s elements to the existing one’s you would have to use the concat() method.

The pop() method

In the same way as the push() method, the pop() one removes one element from the array, specifically the one with the greatest index, the last one. Taking the same example as before, if we want to return the array in it’s original state we would do this:

/* initial array */
var data = [ "X", "A", "B", "C" ];

/* first removal */
data.pop();

/* result */

console.log(data);
/* Output: X A B */

/* second removal */
console.log(data.pop());
/* Output: B */

You see that firstly we have “popped” the last element, leaving the array at: X A B. Then we’ve popped a second element, which the console shows to be B, and thus leaving the array at: X A. One last usage of the pop() function would have given us the array we used in the previous example.

Download the source code

This was an example of array push in Javascript.

Download the source code for this tutorial:

Download
You can download the full source code of this example here: ArrayPush

Do you want to know how to develop your skillset to become a Web Rockstar?

Subscribe to our newsletter to start Rocking right now!

To get you started we give you our best selling eBooks for FREE!

 

1. Building web apps with Node.js

2. HTML5 Programming Cookbook

3. CSS Programming Cookbook

4. AngularJS Programming Cookbook

5. jQuery Programming Cookbook

6. Bootstrap Programming Cookbook

 

and many more ....

 

I have read and agree to the terms & conditions

 

Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments