JavaScript Higher Order Methods
Tags: webdev, javascript, programming, beginners
Published: 2023-02-03 18:39:11

## **METHODS :-**

1. forEach()
2. filter()
3. sort()
4. map()
5. reduce()

Consider an example:-
```
const product = [
  {id: 1,category: "IPhone",name: "Iphone11Pro", start:2007, price:100000},
  {id: 2,category: "MI",name: "Note8", start:2008, price:90000},
  {id: 3,category: "Samsung",name: "GalaxyS45", start:2009, price:80000},
  {id: 4,category: "OnePlus",name: "Nokia24", start:2010, price:50000},
  {id: 5,category: "Nokia",name: "Iphone11Pro", start:2011, price:60000},
  {id: 6,category: "Iphone",name: "Iphone14pro", start:2012, price:120000}
]
```

**1. FOREACH**

Foreach loop (or for each loop) is a control flow statement for traversing items in a collection.

```

//for loop
for(let i=0;i<product.length;i++){
   console.log("[Product]", product[i]);
}

//forEach loop
product.forEach((input) => {
   console.log("[Product]",input);
})
```

**Output:-**

> [Product] {id: 1, category: 'IPhone', name: 'Iphone11Pro', start: 2007, price: 100000}
> VM70:2 [Product] {id: 2, category: 'MI', name: 'Note8', start: 2008, price: 90000}
> VM70:2 [Product] {id: 3, category: 'Samsung', name: 'GalaxyS45', start: 2009, price: 80000}
> VM70:2 [Product] {id: 4, category: 'OnePlus', name: 'Nokia24', start: 2010, price: 50000}
> VM70:2 [Product] {id: 5, category: 'Nokia', name: 'Iphone11Pro', start: 2011, price: 60000}
> VM70:2 [Product] {id: 6, category: 'Iphone', name: 'Iphone14pro', start: 2012, price: 120000}

 
 **2. FILTER**

The filter() method creates a new array with all the elements that pass the test implemented by the callback() function.

```
//for loop
let filter_product = [];
for(let i=0;i<product.length;i++){
  if(product[i].category === 'MI'){
     filter_product.push(product[i]);
  }
}
console.log(filter_product);

//filter
let filter_product = product.filter(
  input => input.category === 'MI'
);
console.log(filter_product);
```

**Output:-**

> 0:{id: 2, category: 'MI', name: 'Note8', start: 2008, price: 90000}
> length:1
> [[Prototype]]: Array(0)

**3. MAP**

The map() method creates a new array with the results of calling a function for every array elements.
The map() method calls the provided function once for each element in an array.

```
//map
//Create array of product name
const product_name = product.map((input) => input.name);
console.log(product_name);

```
**Output:-**

> (6) ['Iphone11Pro', 'Note8', 'GalaxyS45', 'Nokia24', 'Iphone11Pro', 'Iphone14pro']

**4.SORT**

The sort() method is used to sorts the items of an array. It takes two arguments to compare and sort it accordingly.

```
//sort
const sort_product = product.sort((input1,input2) => (
  input1.price > input2.price ? 1 : -1)
);
console.log(sortProduct);
```

**Output:-**

> 0: {id: 4, category: 'OnePlus', name: 'Nokia24', start: 2010, price: 50000}
> 1:{id: 5, category: 'Nokia', name: 'Iphone11Pro', start: 2011, price: 60000}
> 2:{id: 3, category: 'Samsung', name: 'GalaxyS45', start: 2009, price: 80000}
> 3:{id: 2, category: 'MI', name: 'Note8', start: 2008, price: 90000}
> 4:{id: 1, category: 'IPhone', name: 'Iphone11Pro', start: 2007, price: 100000}
> 5:{id: 6, category: 'Iphone', name: 'Iphone14pro', start: 2012, price: 120000}
> length: 6
> [[Prototype]]: Array(0)

**5. REDUCE**

The reduce() method iterates through an array and returns a single value.

```
const product_ids = [1, 2, 3, 4];
const reduce_product_ids = product_ids.reduce((previous, current) => {  
  return previous + current;
});
console.log(reduce_product_ids);

```


**Output:-**

> 10

Follow for more.


![Done](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lmevg7vh1lu5knckm8cb.gif)