Top 10 JavaScript Array Methods You Should Know

Top 10 JavaScript Array Methods You Should Know

·

3 min read

An array is a data structure that holds a list of elements that can store multiple values in a single variable, and the strength of JavaScript arrays lies in the array methods. This article will thoroughly review the Top 10 JavaScript Array Methods You Should Know.

Push ( ) :

In the javascript push method (), we can push elements to the array; it need not be a single element. In push(), we can add one or more elements to the end of a collection, which returns the array's new length.

const players = ['sachin', 'virat', 'dhoni']
players. push('yuvraj', 'rahul', 'ashwin')
console.log(players)

OUTPUT:

[ 'sachin', 'virat', 'dhoni', 'yuvraj', 'rahul', 'ashwin' ]

Splice( )

We can use pop to remove ashwin from the array and sachin from the array. If you want to remove an element from an index, we use a JavaScript method called Splice.

const players = ['sachin', 'virat', 'dhoni']
players.push('yuvraj', 'rahul', 'ashwin')
console.log(players)
players.splice(2,1)
console.log(players)

OUTPUT:

[ 'sachin', 'virat', 'yuvraj', 'rahul', 'ashwin' ]

To remove specific elements using splice ( ) :

Another method to remove is by adding the value of the index splice(2,2), which eliminates 2 deals from the given index.

const players = ['sachin', 'virat', 'dhoni']
players.push('yuvraj', 'rahul', 'ashwin')
console.log(players)
console.log(players.splice(2,2)) // ['dhoni', 'yuvraj]
console.log(players)

OUTPUT:

[ 'sachin', 'virat', 'dhoni', 'yuvraj', 'rahul', 'ashwin' ]

[ 'dhoni', 'yuvraj' ]

[ 'sachin', 'virat', 'rahul', 'ashwin' ]

To add a specific element using splice ( ) :

Splice (index, 0, item) adds an item at the index, where the first element is your index number. The second element is your delete argument, and the final index is one that we need to add.

const players = ['sachin', 'virat', 'dhoni']
players.push('yuvraj', 'rahul', 'ashwin')
console.log(players)
console.log(players.splice(2,2)) // ['dhoni', 'yuvraj]
console.log(players) 
players.splice(2,0, 'irfan')
console.log(players)

OUTPUT:

[ 'sachin', 'virat', 'irfan', 'yuvraj', 'rahul', 'ashwin' ]

includes( )

In javascript, the Includes () method checks if an array includes the element that passes the condition and returns the output in the true or false boolean method.

const players = [1,2,3,4]
console.log(players.includes(2))
console.log(players.includes(6))

OUTPUT :

true

false

Join( ) :

In Javascript, the split method used to convert a string to an array is the same as the join( ) method used to join all elements of an array into a string.

const players = ['sachin', 'virat', 'dhoni']
// split -> strings to array
// join -> array to strings
console.log(players.join(' ->'))
console.log(players)

OUTPUT:

sachin ->virat ->dhoni

sort( )

The sort ( ) method is used to sort an array's elements and elements in ascending or descending order only on alphabets.

const players = ['sachin', 'virat', 'dhoni']
console.log(players.sort())
console.log(players)

OUTPUT :

[ 'dhoni', 'sachin', 'virat' ]

reverse( )

In javascript reverse( ) method is used to reverse the order of the elements in an array.

const players = ['dhoni', 'virat', 'sachin']
console.log(players.reverse())
console.log(players)

OUTPUT :

[ 'sachin', 'virat', 'dhoni' ]

concat( )

Concat ( ) method merges two or more arrays and returns a new array without changing the existing arrays.

const one = ["a","b", "c"];
const two= ["d","e", "f"];
console.log(one.concat(two));
console.log(one);
console.log(two);

OUTPUT :

[ 'a', 'b', 'c', 'd', 'e', 'f' ]

[ 'a', 'b', 'c' ]

[ 'd', 'e', 'f' ]

indexOf( )

In javascript, a method used to search the array for an element and return its position is called indexOf(). Let's understand it with an example.

const players = ['sachin', 'virat', 'dhoni']
console.log(players.indexOf('virat'))  // 1
console.log(players.indexOf('Kuldeep')) //-1

OUTPUT :

1

-1

Conclusion:

As we discussed, those mentioned above are some of the essential JavaScript Array Methods you should know. In our upcoming articles, we will thoroughly review the Javascript Array Methods part -2.

Also, read our article: blog.skillsafari.in/javascript-number-metho...

Did you find this article valuable?

Support Skill Safari by becoming a sponsor. Any amount is appreciated!