10 JavaScript Array Methods You Should Know

Abdul Basir
The Startup
Published in
4 min readNov 6, 2020

Array is one of the most important thing in JavaScript. Without array you cannot imagine JavaScript. Array is combination of elements which are same type. There are total nine data types in JavaScript . You have to put same data type as a array elements.

Let’s make an array in number data type.

const evenNumber = [2, 4, 6, 8, 10];

now check this is array or not by the JavaScript method isArray.

Yep! This is an array. So now I will show you 10 methods which is so useful.

1.array.push()

Think that I want to add an element into this array. I can do this by array.push() method. Let’s adding 12 into our array evenNumber. For this I have used(see photo) evenNumber.push(12). This method will add item as a last element.

2.array.pop()

Now we want remove as element from evenNumber. We can do this by applying the method array.pop(). This method will remove the last element from the array which is 12 now. Look at the photo for observing.

3. array.map()

This method is so much useful. If we want to get every element from array for doing any operation we can use array.map().

Look at the picture. I create an empty array name number and then I applied array.map method into evenNumber. Using this method we have got every called num and then we have push that num into the empty array number. The push method make the array number of 5 element. That’s it.

4. array.concat()

let’s make another array : const oddNumber = [1, 3, 5, 7, 9] . Now we have two array first is evenNumber and another is oddNumber. We want to add this two arrays into one array. This operation can be done by array.concat() method. See the picture. We are getting an array of 10 elements.

5. aray.find()

This is also so useful method. We can find some element by condition. Think we want find those elements from evenNumber which is getter than 5. This method will return only one value which will be the first value grater than 5. It will definitely 6. See photo.

6. array.filter()

If we want to get all the value whose are greater than 5. Then we have use array.filter() method and it will return another array by filtering. Look at the picture. This is really fun.

7. array.indexOf()

If want to know position of any element. Then I can apply array.indexOf() method. Inside the parenthesis we have put that number which index we want to know. Look at picture. I have find out the index of 8 and got result 3. You have to remember that index of array start with 0. then 1 , 2, 3, …. If we want to any index which isn’t valid then we will get the result -1. That’s it.

8.array.splice()

We can put value in the first and last but if we want to put an element anywhere then we can do it by array.splice() method. We have to set 3 values into to parenthesis. first is the index when we want to put (it can be any number beetween the length of array), second value is the delete count, last value will be the elements we want to add. Look at the picture for example. I use delete count 0 for first example and add value 3 in the 2 index. try to understand next example.

9. array.reverse();

This method make any array simply reverse. Look at the example. It makes the first element into last element and last element now first element.

10. array.shift() and array.unshift()

From these two method we can remove and add element to the first. array.shift remove the first element and array.unshift() add the elements between the parenthesis into the array as first elements. look at the example.

That’s it for today. I will come again with another fun topic. thank you.

--

--

Abdul Basir
The Startup

Front end web developer. I love to learn and share my learning knowledge with everyone