DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 968,873 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Kurapati Mahesh
Kurapati Mahesh

Posted on

Javascript: Higher-order functions

A function can take a function as an argument or can return a function as a value is called an higher-order function.

  1. A function that returns a function
const higherOrderFunc = function() {
    return function() {
        return 12;
    }
}

// which returns below function hence it is higher order function.
higherOrderFunc(); 
> Ζ’ () {
        return 12;
    }

higherOrderFunc()();
> 12
Enter fullscreen mode Exit fullscreen mode
  1. A function that takes a function as an argument
const testFunc = function(x) {
    return x + 12;
}

//which takes function as an argument.
const higherOrderFunc = function(testFunc) {
    return testFunc(8);
}

higherOrderFunc(testFunc);
> 20
Enter fullscreen mode Exit fullscreen mode

Example: 1

function calculate(operation, numbers) {
    return operation(numbers);
}

function addition(numbers) {
    let sum = 0;
    for (const number of numbers) {
        sum+=number;
    }
    return sum;
}

function multiply(numbers) {
    let sum = 1;
    for (const number of numbers) {
        sum*=number;
    }
    return sum;
}

const numbers = [1,2,3,4,5];
console.log(calculate(addition, numbers));
> 15

console.log(calculate(multiply, numbers));
> 120
Enter fullscreen mode Exit fullscreen mode

calculate(multiply, numbers) - Don't append parenthesis while sending function as an argument.

Benefits of higher-order functions:

  1. Reduces code duplication
  2. Single responsibility

In Javascript, functions can take arguments as primitives or objects and return the same called first-order functions.

JS built-in higher order functions are:

arr.reduce(), arr.forEach(), arr.filter(), arr.map()

Thanks.

You can follow me here: https://twitter.com/urstrulyvishwak

Top comments (1)

Visualizing Promises and Async/Await 🀯

async await

☝️ Check out this all-time classic DEV post