Most Common JavaScript Array Methods

Chenuka Sumanasekara
3 min readApr 8, 2021

--

In JavaScript, Array is a single variable that is used to store different elements. Basically there are two ways to declare an array in JavaScript.

var cars = [];
var cars = new array();

In this article, I am going to mention mostly common array methods used in JavaScript.

concat()

This method is used to merge two or more arrays. This doesn’t modify the existing array, but returns a new array.

const arr1 = ['Lamborghini', 'Audi', 'Mercedes-Benz'];
const arr2 = ['Ford', 'Toyota'];
const cars = arr1.concat(arr2);
console.log(cars);
//output: ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota']

filter()

This method creates a new array with all elements that pass the test implemented by the provided function.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];const result = cars.filter(car => car.length < 5);console.log(result);
//output: ['Audi', 'Ford']

find()

This method returns the value of the first element in the provided array that satisfies the provided testing function.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];const result = cars.find(car => car.length < 5);console.log(result);
//output: 'Audi'

forEach()

This method executes a provided function once for each array element.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];cars.forEach(car => console.log(car));//output: 'Lamborghini'
//output: 'Audi'
//output: 'Mercedes-Benz'
//output: 'Ford'
//output: 'Toyota'

includes()

This method determines whether an array includes a certain value among its entries, and returns true or false.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.includes('Ford'));
//output: true
console.log(cars.includes('Bugatti'));
//output: false

indexOf()

This method returns the first index at which a given element can be found in the array, or -1 if it is not present.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.indexOf('Lamborghini'));
//output: 0
console.log(cars.indexOf('Bugatti'));
//output: -1

map()

This method creates a new array populated with the results of calling a provided function on every element in the calling array.

const arr = [1, 2, 3, 4, 5];const result = arr.map(e => e * 5);console.log(result);
//output: [5, 10, 15, 20, 25]

pop()

This method removes the last element from an array and returns that element.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.pop());
//output: 'Toyota'
console.log(cars);
//output: ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford']

push()

This method adds one or more elements to the end of an array and returns the new length of the array.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.push('Bugatti'));
//output: 6
console.log(cars);
//output: ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota', 'Bugatti']

reverse()

This method reverses an array in place . The first array element becomes the last, and the last array element becomes the first.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.reverse());
//output: ['Toyota', 'Ford', 'Mercedes-Benz', 'Audi', 'Lamborghini']

shift()

This method removes the first element from an array and returns that removed element.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];console.log(cars.shift());
//output: 'Lamborghini'
console.log(cars);
//output: ['Audi', 'Mercedes-Benz', 'Ford', 'Toyota']

sort()

This method sorts the elements of an array in place as ascending and returns the sorted array.

const cars = ['Lamborghini', 'Audi', 'Mercedes-Benz', 'Ford', 'Toyota'];
cars.sort()
console.log(cars);
//output: ['Audi', 'Ford', 'Lamborghini', 'Mercedes-Benz', 'Toyota']

In this article, I’ve briefly mentioned mostly used array methods in JavaScript and there are some more methods which helps to manipulate data in arrays. You can refer them by visiting,

Thanks for reading!

--

--

Chenuka Sumanasekara

Open Source Enthusiast🖤 | JavaScript Developer👨🏻‍💻 | Undergraduate — Software Engineering🧑🏻‍💻 | SLIIT👨🏻‍🎓