Table of contents
Definition:
A higher-order function is a function that takes one or more functions as arguments or returns a function as its result. Higher-order functions are a fundamental concept in functional programming, and they enable more expressive and concise code.
All important methods are :
map()
: Themap()
method creates a new array by calling a provided function on each element in the original array. It takes a function as an argument and returns a new array with the same number of elements as the original array. Here is an example:
javascriptCopy codeconst numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map(num => num * 2);
console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10]
filter()
: Thefilter()
method creates a new array with all elements that pass the test implemented by the provided function. It takes a function as an argument and returns a new array with the elements that pass the test. Here is an example:
javascriptCopy codeconst numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // Output: [2, 4]
reduce()
: Thereduce()
method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value. It takes a function and an initial value as arguments and returns a single value. Here is an example:
javascriptCopy codeconst numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // Output: 15
forEach()
: TheforEach()
method calls a provided function once for each element in an array. It takes a function as an argument and does not return a value. Here is an example:
javascriptCopy codeconst numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => console.log(num * 2)); // Output: 2, 4, 6, 8, 10
sort()
: Thesort()
method sorts the elements of an array in place and returns the sorted array. It takes a comparison function as an optional argument. Here is an example:
javascriptCopy codeconst numbers = [3, 1, 5, 2, 4];
const sortedNumbers = numbers.sort((a, b) => a - b);
console.log(sortedNumbers); // Output: [1, 2, 3, 4, 5]
These are some of the most commonly used higher-order functions in JavaScript. There are many more such functions available in the language, and you can also create your own higher-order functions as needed.
Basic Example:
Here's a basic example of a higher-order function:
javascriptCopy codefunction applyOperation(num, operation) {
return operation(num);
}
function double(num) {
return num * 2;
}
function triple(num) {
return num * 3;
}
console.log(applyOperation(2, double)); // Output: 4
console.log(applyOperation(3, triple)); // Output: 9
In this example, the applyOperation
function takes two arguments: num
, which is a number, and operation
, which is a function. The applyOperation
function calls the operation
function with the num
argument and returns the result.
The double
and triple
functions are functions that take a number and return its double and triple, respectively.
The applyOperation
function is a higher-order function because it takes the double
and triple
functions as arguments.
Advanced Examples:
Here are some advanced examples of higher-order functions:
javascriptCopy codefunction multiplyBy(factor) {
return function (num) {
return num * factor;
};
}
const double = multiplyBy(2);
const triple = multiplyBy(3);
console.log(double(5)); // Output: 10
console.log(triple(5)); // Output: 15
In this example, the multiplyBy
function is a higher-order function that returns a function. The returned function takes a number and multiplies it by the factor
argument passed to the multiplyBy
function.
The double
and triple
constants are functions that are created by calling the multiplyBy
function with the arguments 2
and 3
, respectively. These functions can then be called with a number argument to return its double or triple, respectively.
javascriptCopy codefunction compose(func1, func2) {
return function (arg) {
return func1(func2(arg));
};
}
function double(num) {
return num * 2;
}
function add5(num) {
return num + 5;
}
const add5ThenDouble = compose(double, add5);
console.log(add5ThenDouble(3)); // Output: 16
In this example, the compose
function is a higher-order function that takes two functions as arguments and returns a function. The returned function calls the second function with the argument, and then calls the first function with the result of the second function.
The double
and add5
functions are functions that double a number and add 5 to a number, respectively.
The add5ThenDouble
constant is a function that is created by calling the compose
function with the double
and add5
functions as arguments. This function takes a number, adds 5 to it, and then doubles the result.
Conclusion:
Higher-order functions are a powerful tool in JavaScript that allow for more expressive and concise code. They enable functions to be treated as first-class citizens and can make code more modular and reusable.