9 Array Methods Every JavaScript Developer Should Know

9 Array Methods Every JavaScript Developer Should Know

Why Array?

Objects allow you to store keyed collections of values.

But quite often we find that we need an ordered collection, where we have a 1st, a 2nd, a 3rd element and so on. For example, we need that to store a list of something: users, goods, HTML elements etc.

There exists a special data structure named Array, to store ordered collections.

Nowdays Array is a ❤️ of javascript if you work with API to communicate with backend.

Oops!!!! Forgive me for the adding basic info about array 😨

Lets get started! 🏃

1. includes()

includes() method checks whether an array contains a specified element.

The includes()method checks whether an array contains a specified element.

const languages = ["Javascript", "Python", "C#", "Java"];languages.includes("Javascript");//output: true

This method returns trueif the array contains the element, and falseif not.

2. reverse()

reverse() method reverses the order of the elements in an array.

The reverse() method reverses the order of the elements in an array.

const languages = ["Javascript", "Python", "C#", "Java"];languages.reverse();//output: ["Java", "C#", "Python", "Javascript"]

Note: this method will change the original array.

3. join()

join() method creates and returns a new string by concatenating all of the elements in an array

The join() method creates and returns a new string by concatenating all of the elements in an array

The elements will be separated by a specified separator. The default separator is comma (,).

const languages = ["Javascript", "Python", "C#", "Java"];languages.join();//output: Java,C#,Python,Javascript

Note: this method will not change the original array.

Warning: If an element is undefined, null or an empty array [], it is converted to an empty string.

4. concat()

concat() method is used to join two or more arrays.

The concat() method is used to join two or more arrays.

const languages = ["Javascript", "Python", "C#", "Java"];const frameworks = ["Angular", "Express", "Next"];const languagesAndFrameworks = languages.concat(frameworks);//output ["Javascript", "Python", "C#", "Java", "Angular", "Express", "Next"]

This method does not change the existing arrays, but returns a new array, containing the values of the joined arrays.

5. every()

every() method checks if all elements in an array pass a test

The every() method checks if all elements in an array pass a test (provided as a function).

let’s look at the year's example:

const years = [2010, 2009, 2021, 2022];years.every(a => a > 2008);//output: true

The every() method executes the function once for each element present in the array:

  • If it finds an array element where the function returns a false value, every() returns false (and does not check the remaining values)
  • If no false occur, every() returns true

Note: every() does not execute the function for array elements without values.

Note: every() does not change the original array

6. push()

push() method adds new items to the end of an array

The push() method adds new items to the end of an array, and returns the new length.

const languages = ["Javascript", "Python", "C#", "Java"];languages.push("GoLang");//output ["Javascript", "Python", "C#", "Java", "GoLang"]

Note: The new item(s) will be added at the end of the array.

Note: This method changes the length of the array.

7. pop()

pop() method removes the last element of an array

The pop() method removes the last element of an array and returns that element.

const languages = ["Javascript", "Python", "C#", "Java"];languages.pop();//output ["Javascript", "Python", "C#"]

Note: This method changes the length of an array.

8. shift()

shift() method removes the first item of an array

The shift() method removes the first item of an array.

const languages = ["Javascript", "Python", "C#", "Java"];languages.shift();//output ["Python", "C#", "Java"]

Note: This method changes the length of the array.

Note: The return value of the shift method is the removed item.

Note: this method will change the original array.

9. unshift()

unshift() method adds new items to the beginning of an array,

The unshift() method adds new items to the beginning of an array, and returns the new length.

const languages = ["Javascript", "Python", "C#", "Java"];languages.unshift("C++, GoLanf");//output ["C++, GoLanf", "Javascript", "Python", "C#", "Java"]

Note: This method changes the length of an array.

You made it 👍

Hope this will help you to play with array in your daily routine of your Javascript life. Share the knowledge with your fellow developers.

Check out few important javascript concepts

If you enjoyed reading this, don’t forget the applause. 👏
Thank you 😊

Happy.Code()

A passionate UI Engineer, Love Travelling and Photography