Array manipulation in JavaScript

Array  is a variable that  is used to store different data types. It basically stores different elements in one variable and can be later accessed  with the variable.

Array manipulation is very important part in JavaScript as developers have to counter with  the array in real application. So let's talk about some major inbuilt function for array manipulation in JavaScript.

pop() and shift()

pop() and shift() methods , use to remove/retrieve an element from array. pop() is used to remove/retrieve last element of array but shift() is used to remove/retrieve first element of array.

for example : 

pop()

  let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.pop()); // "Grapes" : retrieve last element of the array

 

 console.log(fruits); // ["Apple","Orange","Mango","Jackfruit"] : last element removed from the array

shift()

  let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.shift()); // "Apple" : retrieve first element of the array

 

 console.log(fruits); // ["Orange","Mango","Jackfruit","Grapes"] : first element removed from the array

push() and unshift()

push() and unshift() methods, use to insert element in the array. push() insert new element at last index of the array but unshift() insert the new element at the first index of the array.

push()

 let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 fruits.push('Guava');

 

 console.log(fruits); // ["Apple","Orange","Mango","Jackfruit","Grapes","Guava"];

unshift()

 let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 fruits.unshift('Guava');

 

 console.log(fruits); // ["Guava","Apple","Orange","Mango","Jackfruit","Grapes"];

slice() and splice()

slice() method , use to retrieve specified start /end index of the element. It does not alter the array.

for example :

 let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.slice(2,3)); // ["Mango"]

 

 console.log(fruits); //  ["Apple","Orange","Mango","Jackfruit","Grapes"] : does not alter the array

Splice()  method , used retrieve specified start/end index of the element. It does alter the array.

let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.splice(2,3)); // ["Mango","Jackfruit","Grapes"]

 

 console.log(fruits); // ["Apple","Orange"] :  It does alter the array as well

toString() and join()

toString() method, convert array into string separated with comma.

let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.toString()); // "Apple,Orange,Mango,Jackfruit,Grapes"

join() method, used to convert array into string , same as toString() but join() has option to provide separator. 

let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

 console.log(fruits.join("-")); //  "Apple-Orange-Mango-Jackfruit-Grapes"

concat()

concat() method, use to combine to array into an array.

let fruits = ["Apple","Orange","Mango","Jackfruit","Grapes"];

let vegetable = ["Potato","Cauliflower","Apple"]; 

 console.log(vegetable.concat(fruits)); // ["Potato", "Cauliflower", "Apple", "Apple", "Orange", "Mango", "Jackfruit", "Grapes"]

split()

split() method , use for string. It divides the string into substring and return them as array.

let text = "Hello, Javascript, nodeJs";

console.log(text.split(",")); // ["Hello", " Javascript", " nodeJs"]

#shift

#unshift

#pop

#push

#split

#join

#concat

#toString

#slice

#splice