How to call a function that returns another function in JavaScript?

We will call a function by referencing its name and adding parentheses after it. If the function we are calling returns another function (it does in our case), we will need to assign it to a variable or call it immediately. In the future, we will need to make sure that we understand the behavior of the returned function and how it can be utilized in our code. This is call Function Currying.

Function Currying

• Function currying is a technique in functional programming where a function is transformed into a sequence of functions, each taking a single argument.

• This allows for partial application of a function's arguments, and can simplify function composition.

• It is named after the logician Haskell Curry.

• In JavaScript, the `curry` function can be used to curry a given function.

Approach

In JavaScript, you can call a function that returns another function by first assigning the returned function to a variable and then calling it using the variable name, followed by parentheses.

Example

let outerFunction = function() {
   return function() {
      console.log("Inner function");
   }
}
let innerFunction = outerFunction();
innerFunction(); // "Inner function"

Output

Inner function

You could also call the inner function immediately after calling the outer function by adding parentheses to the outer function call, like this −

outerFunction()(); // "Inner function"

It is also possible to use arrow function instead of function −

let outerFunction = () => () => console.log("Inner function");
let innerFunction = outerFunction();
innerFunction(); // "Inner function"

Output

Inner function

Or

outerFunction()(); // "Inner function"

Both will give the same result

Final Code

Here is an example of calling a function that returns another function in JavaScript −

// A function that returns another function
function createMultiplier(x) {
   return function(y) {
      return x * y;
   };
}

// Call the createMultiplier function and assign the returned function to a variable
let double = createMultiplier(2);

// Use the returned function to perform a calculation
console.log(double(5)); // Output: 10

Explanation

• The createMultiplier function takes in a single argument, x, and returns a new function. This returned function takes in a single argument, y, and returns the product of x and y.

• We call the createMultiplier function and pass in the value 2 as an argument, which assigns the returned function to the variable double.

• Now double variable is the function that take an argument y and return x*y where x is 2.

• We call double(5) which will return 2*5 = 10.

In this example, createMultiplier is a higher-order function because it returns a function. The returned function is called a closure because it remembers the value of x from the outer function’s scope.

Output

10