9 Array Methods Every JavaScript Developer Should Know
Tags: javascript, array, webtechpie
Published: 2021-06-19 14:05:52



**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.

**Nowadays 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()

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 true if the array contains the element, and false if not.

## 2. reverse()

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()

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()

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()

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()

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()
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()
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()
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.

[JavaScript Array Methods Cheat Sheet](https://dev.to/hidaytrahman/javascript-array-methods-cheat-sheet-1phb)

`Happy.Code()`