# Array Methods You Must Know

Arrays become really powerful when we use **array methods**. like:

*   add/remove items
    
*   transform data
    
*   filter values
    
*   calculate totals
    
*   loop through arrays easily
    

So lets start to deep dive into Array

## Array Property `.length`

```javascript
let bus = ["0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0", "0"]

console.log(bus.length)// 13 count the items of the array 
```

## Lets discuss about the Arrays methods

### .at() and .indexOf are used to the passenger

```javascript
let friends= ["driver","hitesh","piyush","anirudh","JD"]

console.log(friends.at(2)) //piyush 
//provide the 2nd item (start with 0) 

console.log(friends.indexOf("JD")) //4 
// provide position of item
```

## **.fill() and .concat()**

```javascript
let friends= ["driver","hitesh","piyush","anirudh","JD"]

// .fill() used for update all value at once
friends.fill(1) // [1,1,1,1,1]

//.concat() used for add another array value in an array
let fruits =["mango","apple"]

friends.concat(fruits) 
// ["driver","hitesh","piyush","anirudh","JD""mango","apple"]
```

## **.push() and .pop()**

> add and remove items at ends of the array(list)

```javascript
let friends= ["driver","hitesh","piyush","anirudh","JD"]

console.log(friends.push('another'))// add the last like
//["driver","hitesh","piyush","anirudh","JD","another"]

console.log(friends.pop('another'))// remove from the last like
//["driver","hitesh","piyush","anirudh","JD"]
```

### **.unshift() and .shift()**

> add and remove items at the start of the array(list)

```javascript
let queue = ["Anu", "Ravi"];

queue.unshift("Priya");   // add to front
console.log(queue);       // ["Priya", "Anu", "Ravi"]

const first = queue.shift();   // remove from front
console.log(first);        // "Priya"
console.log(queue);        // ["Anu", "Ravi"]
```

## **.find(), .some(), .every(), .includes(), and .filter()**

> checking for values like:

*   .find() // check for any lady passenger by name
    
*   .some() // check for any lady passenger by boolean
    
*   .every() // check for all passenger is women
    
*   .filter() // give me the ladies passenger list
    

```javascript
const passengers = [
{ name: 'Driver', gender: "M", ticket: false },
{ name: 'Conductor', gender: "M", ticket: false },
{ name: 'Divya', gender: "F", ticket: true },
{ name: 'Kavya', gender: "F", ticket: true },
{ name: 'Sandya', gender: "F", ticket: true },
{ name: 'Vandya', gender: "F", ticket: true },
{ name: 'Hitesh', gender: "M", ticket: true },
{ name: 'Piyush', gender: "M", ticket: true },
{ name: 'Anirudh', gender: "M", ticket: false },
{ name: 'Jagdamba', gender: "M", ticket: true },
{ name: 'Dubey', gender: "M", ticket: true }
];

const arrFind = passengers.find(item => item.gender==="F");
console.log('arrFind ', arrFind ) 
// return the Divya details first F gender passenger

const arrSome = passengers.some(item => item.gender==="F"); 
console.log('arrSome ', arrSome )
// return TRUE bacause of some passengers gender are F

const arrEvery = passengers.every(item => item.gender==="F"); 
console.log('arrEvery ', arrEvery )
// return FALSE because not every passengers gender is F

const arrInclude = passengers.includes(item => item.gender==="F"); 
console.log('arrInclude ', arrInclude )
// return FALSE because not every passengers gender is F

const arrFilter = passengers.filter(item => item.ticket === false); 
console.log('arrFilter ', arrFilter )
// return list of ticket false list
```

### .includes()

> check for value incluedes

```javascript

const names = ["Divya", "Kavya", "Hitesh"];
const arrInclude = names.includes("Divya");
console.log('arrInclude', arrInclude); //true
```

### **.map(), .flat() and .flatMap()**

```javascript
//.map(): used for any performance with each element
gents = ["Hitesh","Piyush","Jagdamba","Dubey"]
const isFriend = gents.map((f, i)=> f+" is my freind");
console.log(isFriend)
// ['Hitesh is my freind', 'Piyush is my freind', 'Jagdamba is my freind', 'Dubey is my freind']

//.flat(): used for combining multiple arrays into a single array
staff = ["dirver", "conductor"]
ladies = ["Divya","Kavya","Sita","Geeta"]
const newArr = [staff , ladies ].flat(); // merge arrays
console.log(newArr ); 
//(6) ['dirver', 'conductor', 'Divya', 'Kavya', 'Sita', 'Geeta']

// .flatMap compbined all values
const bus = [staff, ladies, gents].flatMap(p => p + ' in the bus'); 
console.log(bus);
//  ['dirver,conductor in the bus', 'Divya,Kavya,Sita,Geeta in the bus', 'Hitesh,Piyush,Jagdamba,Dubey in the bus']
```

## **.split() and .join()**

```javascript
let myFriends = "Hitesh,Piyush,Jagdamba,Dubey"
//.split(',') create array with diffence of given value
const friendArr = myFriends.split(',')
console.log(friendArr) //['Hitesh', 'Piyush', 'Jagdamba', 'Dubey']

// .join() create string from arrays
const names = frinedArr.join(',')
console.log(names) // 'Hitesh,Piyush,Jagdamba,Dubey'
```

### **.slice()**

> .slice() does not modified original array

```javascript
let bus = ["Hitesh","Piyush","Jags","Students"]
const sliceBus = bus.slice(2)
console.log(bus) // ['Hitesh', 'Piyush', 'Jags', 'Students']
console.log(sliceBus)  // ['Jags', 'Students']
```

### **.splice()**

> .splice() update the original array and credendial

```javascript
let bus = ["Hitesh","Piyush","Jags","Students"]
const sliceBus = bus.splice(2)
console.log(bus) // ['Hitesh', 'Piyush']
console.log(sliceBus)  // ['Jags', 'Students']
```

###   
**.reduce()**

> .reduce() is used for some calculations with all elements. like the total collection of bus tickets.

```javascript
let ticketSold = [10,15,20,30,40,50,5];
let totalSold = ticketSold.reduce((total,perticket) => total + perticket,0); //returns 170
```

## Surprise ... (create your own methods)

```javascript
Array.prototype.ticketDone = function(mes){ 
let pList = []; 
for(let i = 0; i < this.length; i++){ 
    pList.push(mes(this[i])); 
} 
return pList; 
}

let bus = ["p1","p2","p3","p4","p5","p6","p7","p8"]
bus.ticketDone(pas => pas + " ticket kat gaya");
// ['p1 ticket kat gaya', 'p2 ticket kat gaya', 'p3 ticket kat gaya', 'p4 ticket kat gaya', 'p5 ticket kat gaya', 'p6 ticket kat gaya', 'p7 ticket kat gaya', 'p8 ticket kat gaya']
```

## Summary

Now code summary is code try to better understand this.

```javascript
const myArr = [1,2,3,4,5.5] myArr.length() 
// returns the array length ( count of items the array is 5)
myArr.at(n) 
// get the value of nth position ( 4th position value is 5.5)
myArr.indexOf(4) 
// get the position of value (5 is at 4th position)
myArr.concat(4,[45,56,76,86]) 
// add more value into the array (also can be single value or can be another array itself)
myArr.fill(0); 
// fill all the position with passed value
myArr.find((item) => item < 7) 
// check for the first item to match the condition
myArr.some((item) => item < 7) 
// check for the some item to match the condition
myArr.every((item) => item < 7) 
// check for all items to match the contions with iterations with true and false
myArr.includes(item); 
// return booleans if item avilable or not in the array
myArr.filter((item) => item >4) 
// return the list of the array with matched the conditions m
myArr.map(item => item * 2) 
// return the new array with any actions performed with each elements
myArr.flat(); 
// convert in the single array from multilevel array
myArr.flatMap(item => item + "a") 
// maping and also flat the array if there is multilevel array
myArr.join('-') 
// return string with all value differnciate with mentioned value
myArr.split('-') 
// return array with split value myArr.push(7) // add new item in the last of the array myArr.pop // removed and returns the last item of the array
myArr.unshift(0) 
// add new item or items in the start of array
myArr.shift() 
// removed first item from array
myArr.splice(start, count) 
// returns removed form old array and return the new array from start to number of counts
myArr.slice(count) 
// just slice removed or sliced from start to count
arr.reduce((total,item) => total+item,intial) 
// return the sum of the array with intial if added
```
