Push Pop Shift Unshift Array methods in Javascript

    Oct 20, 2019       by Pankaj Kumar
push-pop-shift-unshift-array-methods.jpg

Javascript have a rich set of inbuilt methods to perform a different type of operations with its String and Arrays. Today in this article, We will see the example of the few very common Array methods Push, Pop, Shift, Unshift. 

 

We will try to understand these Array methods with examples below. You can use the browser console to run these examples at your end.

 

JavaScript Array push() Method

The array push() method adds the new items to the end of an array and returns a new length. The new item(s) will be added at the end of an array. 

If you want to add a new item at the very beginning of the Array, then unshift() is used for it.

 

Let's see the example below:

Add a single item to an Array

 
let fruits = ['Mango','Banana','Apple'];
 
fruits.push('Orange');
console.log(fruits); // output will be["Mango", "Banana", "Apple", "Orange"]
 

 

Add multiple items to an array

 
let fruits = ['Mango','Banana','Apple'];
 
fruits.push('Orange','Guava');
console.log(fruits); // output will be["Mango", "Banana", "Apple", "Orange","Guava"]
 

 

Add Object to an Array of object

 
let countries = [
{ name:"England", language:"English" },
{ name:"Bangladesh", language:"Bangla" },
{ name:"Iran", language:"Urdu" }
];
 
countries.push({type: "India", language: "Hindi"});
console.log(countries);
// Below is the output
//(4) [
//0: {name: "England", language: "English"}
//1: {name: "Bangladesh", language: "Bangla"}
//2: {name: "Iran", language: "Urdu"}
//3: {type: "India", language: "Hindi"}
//]
 

 

JavaScript Array pop() Method

This method removes the item of the very last position of the array and returns that item. This method changes the length of the array.

When pop() applies on an empty array, undefined is returned.

 

 
let fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop(); // output is: "Mango"
 

 

 
let countries = [
{ name:"England", language:"English" },
{ name:"Bangladesh", language:"Bangla" },
{ name:"Iran", language:"Urdu" },
{ name:"India", language:"Hindi" }
];
 
let removedItem = countries.pop();
console.log(countries);
console.log("removed Item", removedItem);
// Below are the output...
// [{name: "England", language: "English"}1: {name: "Bangladesh", language: "Bangla"}2: {name: "Iran", language: "Urdu"}]
// removed Item {name: "India", language: "Hindi"}
 

 

JavaScript Array unshift() Method

The unshift() method adds a new item to the beginning of an array and returns the new length.

 

 
let countries = [
{ name:"England", language:"English" },
{ name:"Bangladesh", language:"Bangla" },
{ name:"Iran", language:"Urdu" }
];
 
countries.unshift({ name:"India", language:"Hindi" }); // if we console this line then new length will be printed.
console.log(countries);
// Below is the output
//[
//0: {name: "India", language: "Hindi"}
//1: {name: "England", language: "English"}
//2: {name: "Bangladesh", language: "Bangla"}
//3: {name: "Iran", language: "Urdu"}
//]
 

 

JavaScript Array shift() Method

This method removes the first element of the Array. It also changes the length of the Array. 

 

 
let countries = [
{ name:"England", language:"English" },
{ name:"Bangladesh", language:"Bangla" },
{ name:"Iran", language:"Urdu" }
];
 
countries.shift(); // if we console this line then the removed item will be printed
console.log(countries);
// Below is the output
//(2) [
//0: {name: "Bangladesh", language: "Bangla"}
//1: {name: "Iran", language: "Urdu"}
//]
 

 

Let me know your thoughts over email demo.jsonworld@gmail.com. I would love to hear them and If you like this article, share with your friends.

 


WHAT'S NEW

Find other similar Articles here: