A list of array methods in javascript
Tags: javascript, arraymethods, weddev, programming
Published: 2021-02-01 18:02:45

Here are a few of javascript array methods with simple explanation and examples : 
1. [push()](#push)
2. [unshift()](#unshift)
3. [pop()](#pop)
4. [shift()](#shift)
5. [concat()](#concat)
6. [findIndex()](#findindex)
7. [forEach()](#foreach)
8. [includes()](#includes)


#### push() 
This method adds one or more elements to the end of an array and returns the new length of the array. 
```javascript
const arr = [1, 2, 3]
console.log(arr.push(4)) // 4
// arr is now [1,2,3,4]

// adding multiple items
arr.push(-1,-2,-3)
console.log(arr) // 1,2,3,4,-1,-2,-3
```

#### unshift() 
This method is exactly same as **push()** but it adds items to the front of an array. 
```javascript
const arr = [1, 2, 3]
console.log(arr.unshift(4)) // 4
// arr is now [4,1,2,3]
// adding multiple items
arr.unshift(-1,-2,-3)
console.log(arr) // -1,-2,-3, 4,1,2,3
```

#### pop() 
This method removes and returns the last element of an array . It does not take any parameters.
```javascript
const arr = [1, 2, 3]
console.log(arr.pop()) // 3
// arr is now [1,2]
```

#### shift() 
This one is same as **pop()**, but it removes and returns item from the beginning instead of end.
```javascript
const arr = [1, 2, 3]
console.log(arr.shift()) // 1
// arr is now [2,3]
```

#### concat() 
This method joins two or more arrays and returns the joined array. It does not alter the main array. 
```javascript
const arr1 = [1, 2, 3]
const arr2 = [4, 5, 6]
const arr3 = arr1.concat(arr2)

console.log(arr1)[ 1, 2, 3 ]
console.log(arr2)[ 4, 5, 6 ]
console.log(arr3) // [ 1, 2, 3, 4, 5, 6 ]
```

#### find() 
This method takes an function as a parameter which will run once for each item. If certain condition is matched for one item , it will simply return the item and will not execute anymore. Otherwise it returns `undefined`. 
```javascript
const arr1 = [1, 2, 3]

const item = arr1.find((item) => item === 3)
const item1 = arr1.find((item) => item === 323)

console.log(item) // 3
console.log(item1) // undefined
```

#### findIndex() 
This one is same to *find()* but instead of returning the value itself it just reutrns the index. If no item pass the condition it returns -1.

It also takes some optional parameters inside the function like `function(item, index, array)`
```javascript
const arr1 = [1, 2, 3]

const item = arr1.findIndex((item) => item === 3)
const item1 = arr1.findIndex((item) => item === 323)

console.log(item) // 3
console.log(item1) // undefined
```

#### forEach() 
Sometimes you need to loop through an array but you don't want to write any for loop. Okay , the `forEach()` method will help you here. It takes an callback function inside it and the callback function can will run for each item of the array like this `function(value, index, array)`. 

`index` and `array` are optional parameters.

```javascript
const items = ['John', 'Doe', 30]

items.forEach((value, index, arr) => {
  console.log('index : ', index) // index of current item
  console.log('value : ', value) // current item is iterating
  console.log('arr : ', arr)     // the original array
})
```

#### includes() 
This method checks whether an item is present in an array or not. It takes two parameter inside the function `includes(whatToFind, whereToStart)`. The first parameter is which element you wanna check for and the second one is where to start finding it.
```javascript
const items = ['John', 'Doe', 30]

const included = items.includes('John', 0)
const included1 = items.includes('John', 2)

console.log(included)  // true
console.log(included1) // false
```