JavaScript Arrays’ Methods

Array push()

The push() method adds a new element to the end of the array.

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
vehicles.push(“Plane”);


//Output -> [“Car”, “Bus”, “Van”, “Lorry”, “Bike”, “Plane”]

and also you can get new array length by implementing like this,

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
let length = vehicles.push(“Plane”);


//Output -> 6

Array pop()

The pop() method is used to remove the last element of the array.

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
vehicles.pop();


//Output -> [“Car”, “Bus”, “Van”, “Lorry”]

If you want to get the pop value you need to implement like this,

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
let value = vehicles.pop();


//Output -> Bike

Array shift()

By using this shift() method, you can remove the array first element. Refer the below example.

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
vehicles.shift();


//Output -> [“Bus”, “Van”, “Lorry”, “Bike”]

If you want to get the removed value, use

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
let value = vehicles.shift();


//Output -> Car

Array unshift()

If you want to add a new element to the beginning, this is the method for that.

const vehicles = [“Car”, “Bus”, “Van”, “Lorry”, “Bike”];
vehicles.unshift(“Plane”);


//Output -> [“Plane”, “Car”, “Bus”, “Van”, “Lorry”, “Bike”]

Array concat()

The concat() method creates a new array by merging existing arrays. If you want to merge two arrays, you can use this.

const array01 = [“A”, “B”, “C”];
const array02 = [“D”, “E”, “F”];
const newArray = array01.concat(array02););


//Output -> [“A”, “B”, “C”, “D”, “E”, “F”]

Here is another example,

const array01 = [“A”, “B”, “C”].concat(“D”);

//Output -> [“A”, “B”, “C”, “D”]

Array join()

const array01 = [“A”, “B”, “C”].join(“-“);

//Output -> A-B-C

Here is another example,

const array01 = [“A”, “B”, “C”].join(” and “);

//Output -> A and B and C

Array slice()

The slice() method slices out elements. If you use slice(1), array will remove first element. If you use slice(3), array will remove first 3 elements.

const array01 = [“A”, “B”, “C”].slice(1);
//Output -> [“B”, “C”]

const array01 = [“A”, “B”, “C”].slice(2);
//Output -> [“C”]

Array splice()

This is splice, not slice. Do not mess with this. Lol. The splice() method can be used to add new items to an array:

const array01 = [“A”, “B”, “E”];
array01.splice(2, 0, “C”, “D”);


//Output -> [ ‘A’, ‘B’, ‘C’, ‘D’, ‘E’ ]

In here, “2” means the position where new elements should be added and the “0” means, how many elements should be removed. If you replace 0 with any number, let assume you will replace 0 with 1, you will get,

const array01 = [“A”, “B”, “E”];
array01.splice(2, 1, “C”, “D”);


//Output -> [ ‘A’, ‘B’, ‘C’, ‘D’ ]

It means last element will remove from the array. If you add 3, the output will be [ ‘A’, ‘B’, ‘C’, ‘D’ ].

const array01 = [“A”, “B”, “E”];
array01.splice(2, 3, “C”, “D”);


//Output -> [ ‘A’, ‘B’, ‘C’, ‘D’ ]

Because there is no 3 elements after you added position¬†2 (It means after “B” only has “E”. if your array has [“A”, “B”, “E”, “F”, “G”], then you will see after position 2, elements will remove).

Array indexOf()

If you want to get the index of an element, you can use this method.

const array01 = [“A”, “B”, “C”].indexOf(“B”);

//Output -> 1

Array includes()

If you want to find out an element is in your array or not, you can use this method.

const array01 = [“A”, “B”, “C”].includes(“B”);

//Output -> True

Array find()

const array01 = [3, 5, 6, 8].find( (n) => n % 2 === 0 );

//Output -> 6

Also you can use this method like this,

const ages = [3, 10, 18, 20];

function checkAge(age) {
     return age > 18;
}

const array01 = ages.find(checkAge);


//Output -> 20

Array findIndex()

Find the index that you need to find something.

const array01 = [2, 4, 3, 5].find( (n) => n % 2 !== 0 );

//Output -> 3

Another example,

const ages = [3, 10, 18, 20];

function checkAge(age) {
     return age > 18;
}

const array01 = ages.findIndex(checkAge);


//Output -> 3

Array Map()

I am using map() method to multiply by 2 array elements.

const array01 = [2, 4, 3, 5].map( (n) => n * 2);

//Output -> [ 4, 8, 6, 10 ]

const No = [2, 4, 6, 8];

function multiple(No) {
return No * 2;
}

const array01 = No.map(multiple);


//Output -> [ 4, 8, 12, 16 ]

Array filter()

const array01 = [3, 5, 6, 8].filter( (n) => n % 2 === 0 );

//Output -> [6, 8]

Here is some documentation for more details – Click here

Array reduce()

const array01 = [2, 4, 3, 7].reduce( (acc, cur) => acc + cur );

//Output -> 16

Here is another perfect example for this method – Click here

Array every()

I am checking my every array element greater than 6 or not.

const array01 = [2, 3, 4, 5].every( (x) => x < 6 );

//Output -> true

Array some()

I am checking my array has element that greater than 6.

const array01 = [3, 5, 6, 8].some( (x) => x > 6 );

//Output -> true

Array reverse()

If you want to reverse your array element you can use this method.

const array01 = [3, 5, 6, 8].reverse();

//Output -> [8, 6, 5, 3]

Thank you for reading. If you are interesting on my article, make sure to follow my other articles as well.