# 20+ JavaScript Built-in Array Methods

Arrays are one of the most used data structures in JavaScript. In this article, we explore built-in array methods in JavaScript. 

# filter 
The `filter()` method creates a new array with all elements that satisfies a given condition. The `filter()` does not change the original array. 


```
const numbers = [8, 5, 11,16];

const filteredNumbers = numbers.filter(number => number > 10)  // [11,16]

``` 
# map 
The `map()` method creates new array by calling a function on every element of original array. It changes the original array. 

```
const numbers = [1,4,16,25,49]

const squaredNumbers = numbers.map((number) => Math.sqrt(number)) // [1,2,4,5,7]
``` 
# reduce
The `reduce()` reduces original array to a single value by calling a reducer function. It does not change the original array. 

```
const numbers = [0, 1, 3, 5, 8, 14];

const sum = numbers.reduce((accumulator, item) => accumulator + item);  //31
``` 
 # find 
The `find()` methods returns the first element in an array that satisfy the given condition. If no value satisfy the provided condition, `undefined` will be returned. The `find()` method does not change the original array.

```
const numbers = [8, 5, 11,16];

const result = numbers.filter(number => number > 10)    // "11"
``` 
# pop
The `pop()` method removes the **last** element of a given array and returns the element. The `pop()` method changes the original array. 

```
const numbers = [2,3,7,8,9,11,12]

const removedNumber = numbers.pop(); //12
``` 
# shift
The `shift()` method removes the **first** element of an array and returns the removed element. It changes the original array. 

```
const numbers = [2,3,7,8,9,11,12]

const firstElement = numbers.shift() // 2
``` 
# push 
The `push()` method add one or more elements to the end of an array and returns the new length of the array. It changes the original array. 
```
const numbers = [2,3,7,8,9,11,12]

const numbersLength = numbers.push(17,22) 

console.log(numbersLength) // Prints "9"

``` 
# unshift
The `unshift()` method adds one or more element to the beginning of an array and return the new length of the array. 
```
const numbers = [2,3,7,8,9,11,12]

const numbersLength = numbers.unshift(17,22) 

console.log(numbersLength) // Prints "9"
``` 
# includes
The `includes()` method checks if a certain value is among array elements and returns `false` or `true`. When comparing strings and characters, `includes()` is *case-sensitive*.

```
[0, 1, 2, 5, 8, 10].includes(2)      // true
``` 
If provided with a specific index, it searches from that index and ignores previous indexes. 

```
[0, 1, 2, 5, 8, 10].includes(2, 3) // false
``` 
# forEach
The `forEach()` methods execute a function on every element of an array. 

```
const numbers = [3,7,6]

number.forEach((number,index) => {
   console.log(number, index) // Prints "0" "3" "1" "7" "2" "6"
})
``` 
# slice 
The `slice()` method return a new array from the original array from `start` to `end` (`end` is not included), where `start` and `end` are index of items in that array. The original array will not be modified. 
### Syntax 

```
slice(start, end)
``` 
`start` and `end` are both optional. If `start` is omitted or `undefined`, `slice` starts from index `0`. If `end` is omitted or `undefined`, `slice` extracts through the end of the array.

```
const numbers = [2,3,7,8,9,11,12]

const slicedNumbers = numbers.slice(2,5) // slicedNumbers [7,8,9]
``` 
# splice
The `splice()` method has three applications: 
   - Deleting elements from an array 
   - Adding elements to an array 
   - Replacing elements in an array

The `splice()` method changes the original array. 


```
const numbers = [2,3,7,8,9,11,12]

const deletedNumbers = numbers.splice(0,2) 

// numbers [7,8,9,11,12]
// deletedNumbers [2,3]
```

```
const numbers = [2,3,7,8,9,11,12]
const addedNumber = numbers.splice(2,0,25)

// numbers [2,3,25,7,8,9,11,12]
``` 
```
const numbers = [2,3,7,8,9,11,12]
const addedNumber = numbers.splice(2,1,25)

// numbers [2,3,25,8,9,11,12]
``` 

# indexOf 
The `indexOf()` method searches for an element and returns its position. If not found. it returns `-1`. The `indexOf()` method uses strict equality to compare given value to elements of array. 

```
const numbers = [2,3,7,8,9,11,12]

numbers.indexOf(8) // 3
numbers.indexOf(17) // -1

``` 
# concat
The `concat()` method merges two or more arrays and returns a new array. The `concat()` method does not change original arrays. 

```
const array1 = [0,1,2]
const array2 = [3,4,5]

const numbers = array1.concat(array2)  

console.log(numbers) // Output [0,1,2,3,4,5]
``` 
# sort
The `sort()` methods sorts elements of an array. It changes the original array. The default sort order is ascending. 

```
const numbers = [3,1,2,0]

numbers.sort() // numbers [0,1,2,3]
``` 
# reverse 
The `reverse()` method reverses the order of elements in an array. It changes the original array. 
```
const numbers = [0,1,2,3]
const reversedNumber = numbers.reverse() 

//reversedNumbers [3,1,2,0]
``` 
# join
The `join()` method creates a new string by concatenating all elements of an array and returns that string.  The default separator is comma (,), but it can be anything. If the given array has only one element, that element will be returned without any separators.  

```
const numbers = [1,2,3,4]
numbers.join()  // '1,2,3,4'
numbers.join(", ") // '1, 2, 3, 4'
numbers.join("") // '1234'
``` 
# toString
The `toString()` methods converts an array to string and returns the result. It does not change the original array. 

```
const numbers = [2,3,7,8,9,11,12]

const result  = numbers.toString()
 
//result "2,3,7,8,9,11,12"
``` 

 # some 
The `some()` method checks whether at least one element of array passes provided test and returns true. If nothing found, it returns false. It does not change original array. 

```
[2,3,7,8,9,11,12].some((x) => x > 30) // false
[2,3,7,8,9,11,12].some((x) => x > 10) //true
``` 
# every 
The `every()` method tests whether all elements of an array pass the provided test. It does not modify the original array. 

```
[7,7,7].every(num => num === 5) //true 
``` 
# fill 
The `fill()` method converts all elements of an array to a static value. You can define `start` and `end` for the part of array you want to change. It modifies the original array. 

```
[1,2,3,4].fill(7)  // [7,7,7,7]
[1,2,3,4].fill(7, 1)  // [1,7,7,7]
``` 
# findIndex 
The `findIndex()` method returns the index of the first element in an array that satisfy the provided criteria. If nothing found, `-1` will be returned. 

```
const numbers = [2,3,7,8,9,11,12]

const result = numbers.findIndex(8)  

// result "3"
```