JavaScript Array Methods

JavaScript Array Methods

toString()

This method is used when you want to convert an array of comma-separated elements to a string.

let arr = ["red", "blue", "white"]
console.log(arr.toString()) // 'red,blue,white'

join()

This method behaves the same as the toString() method but this gives the functionality to join the elements of the array using different characters, such as in the below example we have used the '-' symbol.

let arr = ["red", "blue", "white"]
console.log(arr.join('-')) // 'red-blue-white'

push()

This method adds a new element to the end of an array.

let arr = ["red", "blue", "white"]
arr.push('pink') // will add 'pink' to the end of an arr
console.log(arr) // ['red', 'blue', 'white', 'pink']

pop()

The method pop() behaves the opposite of the push() method, meaning it will pop/delete the last element from an array and return the deleted item.

let arr = ["red", "blue", "white"]
arr.pop() // will remove 'white'
console.log(arr) // ['red', 'blue']

shift()

As the name suggests this shifts the elements from the first.
It works the same as a pop() method but it removes elements from the start of an array, not from the end.

let arr = ["red", "blue", "white"]
arr.shift() // removing first item 'red'
console.log(arr) // ['blue', 'white']

unshift()

This method adds the element at the beginning of an array. Works similarly to the push() method we have seen above.

let arr = ["red", "blue", "white"]
arr.unshift('yellow') // adding 'yellow' to the beginning of an arr
console.log(arr) // ['yellow', 'red', 'blue', 'white']

length property

This property gives the total number of elements present in the array.

let arr = ["red", "blue", "white"]
console.log("the total number of elements in the array ", arr.length) // 3

concat()

The concat() method creates a new array by merging the existing arrays. In short, it helps in concatenating/merging the arrays.

let carNames = ['bmw', 'ford', 'suzuki']
let average = [15.2, 16, 18.7]
console.log(carNames.concat(average)) // ['bmw', 'ford', 'suzuki', 15.2, 16, 18.7]

splice()

It helps in adding a new element to the array.

let fruits = ["papaya", "mango", "kiwi", "banana"];
fruits.splice(3, 0, "orange", "grapes");
console.log(fruits) // ['papaya', 'mango', 'kiwi', 'orange', 'grapes', 'banana']

Here in the method splice() we have given 4 arguments, where the first 2 are as below
1st one tells the position where the element needs to be inserted.
2nd one tells the number of items to be removed from the next of the given position.
For Example: if 3 is the position and items to be removed are greater than 0, it will start removing elements from 4.

We can also use splice to remove elements from the specific position.

slice()

It slices the part of an array and returns from it.
This method creates a new array and will not affect the original array.
It can accept 2 arguments and can also accept 1 argument.
The first argument indicates the start and the second indicates the end.
If we pass only one argument then that will be considered a start index.

let fruits = ["papaya", "mango", "kiwi", "banana"];
console.log(fruits.slice(3)) // ['banana']
console.log(fruits.slice(1,4)) // ['mango', 'kiwi', 'banana']

sort()

This method helps to sort an array in ascending order.

let numbers = [3, 6, 1, -2, 0, 4, 88, 3, 24]
console.log(numbers.sort()) // [-2, 0, 1, 24, 3, 3, 4, 6, 88]

reverse()

This method helps to reverse an array.
We can also use this method after the sort() method.
As the sort() method sorts the elements in ascending order and after implementing the sort method we can use the reverse() method to make an order descending.

let numbers = [3, 6, 1, -2, 0, 4, 88, 3, 24]
numbers.sort() // [-2, 0, 1, 24, 3, 3, 4, 6, 88]
numbers.reverse() // [88, 6, 4, 3, 3, 24, 1, 0, -2]
console.log(numbers) // [88, 6, 4, 3, 3, 24, 1, 0, -2]

In this article, we have explored some of the methods of Array in JavaScript. Hope it adds some value to your knowledge. Thanks for reading.