## DEV Community # Higher Order Function in Javascript

Hello Guys today i am going to discuss Higher order function in javascript.
Lets get started...

## What is Higher Order Function?

A “higher-order function” is a function that accepts another functions as parameters and/or returns another function.

Lets understand the importance of Higher order function with a beautiful example -

## Example - Using Normal approach -

``````//Normal Functions

const calculateArea = (radius) => {
const output = [];
for (let i = 0; i < radius.length; i++) {
}
return output;
}

const calculateCircumference = (radius) => {
const output = [];
for (let i = 0; i < radius.length; i++) {
}
return output;
}

const calculateDiameter = (radius) => {
const output = [];
for (let i = 0; i < radius.length; i++) {
}
return output;
}

``````

### Output-

``````[
78.53981633974483,
201.06192982974676,
314.1592653589793,
615.7521601035994
]
[
31.41592653589793,
50.26548245743669,
62.83185307179586,
87.96459430051421
]
[ 10, 16, 20, 28 ]
``````

### Explaination -

• Here first we have created an array of 4 elements , these elements represent radius of circles.
• Then we have created 3 functions namely "calculateArea" , "calculateCircumference" and "calculateDiameter" to calculate area , circumference and diameter of these 4 circles.
• Inside every function we have created a output empty array and then iterate over the radius array and push the value to the empty output array after applying the logic related to that function .
• But it violates the DRY - "Dont Repeat Yourself" principal as you can see the functions are almost 90% same just the logic part is different and we repeating that 90% part again and again.

### Example - Higher order function approach

``````
const area = (radius) => {
//logic for area
}
const circumference = (radius) => {
//logic for circumference
return 2 * Math.PI * radius;
}

const diameter = (radius) => {
//logic for diamter
}

//passing the logic function as an argument
const calculate = (radius,logic) => {
const output = [];
for (let i = 0; i < radius.length; i++) {
//using the logic function passed in the parameter
//and inside the logic function , we have passed
}
return output;
}

//passing the area function as an argument

//passing the circumference function as an argument

//passing the diamtere function as an argument

``````

### Output-

``````[
78.53981633974483,
201.06192982974676,
314.1592653589793,
615.7521601035994
]
[
31.41592653589793,
50.26548245743669,
62.83185307179586,
87.96459430051421
]
[ 10, 16, 20, 28 ]
``````
• As you can see , we have created 3 functions for area, circumference and diamter with the logic part and passed these function as an argument to calculate function.
• It makes our code more reusable and more cleaner and easy to read.
• This is the beauty of higher order functions.

## Example - Using map function

If you see the example above more closely what we are doing is mapping the array with some logic , let me explain it with an example

``````//We can implement the same logic above in the example
// like this
const area = (radius) => {
}
const circumference = (radius) => {
return 2 * Math.PI * radius;
}
const diameter = (radius) => {
}
//mapping the value with the logics using
//map function by passing the logic as an
//arguments like we did in the above example
``````

### Output-

``````[
78.53981633974483,
201.06192982974676,
314.1592653589793,
615.7521601035994
]
[
31.41592653589793,
50.26548245743669,
62.83185307179586,
87.96459430051421
]
[ 10, 16, 20, 28 ]
``````
• As you can see, the map functions produces the same result like in the example above.