Skip to main content

Command Palette

Search for a command to run...

Currying in JavaScript

Published
3 min readView as Markdown
Currying in JavaScript
T

I'm a recent graduate with a degree in Mechanical Engineering but I have a passion for web development. I have hands on in ReactJS and I have experience building responsive, user-friendly web applications using this framework. I gained hands-on experience in web development through several projects . I'm proficient in HTML, CSS, JavaScript, and I have experience working with various front-end technologies such as ReactJS, Redux, and Bootstrap. I'm also familiar with back-end development such as Node.js and Express.js.

Before implementing currying in javascript we know about the meaning of currying.

What is Currying?

Currying is the technique of converting a function that takes multiple arguments into a sequence of functions, each taking a single argument.This enables you to partially apply arguments to a function and create new functions with fewer parameters.

Currying is a transformation of functions that translates a function from callable as f(a, b, c) into callable as f(a)(b)(c)

The transformed functions can be invoked one after another, each accepting a single argument, until all the required arguments are provided and the final result is obtained. Currying doesn’t call a function. It just transforms it.

We can implement function currying using two methods:

bind() method

closures

Currying using bind() method

function multiply(x, y) {
  return x * y;
}

// Partially apply the multiply function using bind()
const double = multiply.bind(null, 2);

console.log(double(5)); // Output: 10
console.log(double(7)); // Output: 14

In the above example, the bind() method is called on the multiply function. The first argument passed to bind() is the this value, which is set to null in this case since the multiply function doesn't rely on a specific context (this value). The second argument passed to bind() is 2, which becomes the pre-defined value for the x parameter of the multiply function.

The bind() method returns a new function double that is a partially applied version of multiply. When double is invoked with a single argument, it will multiply that argument by the pre-defined value of 2, effectively doubling the given number.

Look at another example

function multiply(x, y) {
  return x * y;
}

// Partially apply the multiply function using bind()
const double = multiply.bind(null, 2);

console.log(double(5)); // Output: 10
console.log(double(7)); // Output: 14

const triple = multiply.bind(null, 3);

console.log(triple (5)); // Output: 15
console.log(triple (7)); // Output: 21

Currying helps in creating more flexible and reusable code by promoting composition and function transformation.

Currying using closures

Closure makes currying possible in JavaScript as Closure gives you access to an outer function’s scope from an inner function.

It’s ability to retain the state of functions already executed, gives us the ability to create factory functions  ( functions that can add a specific value to their argument)

function add(x) {
  return function(y) {
    return x + y;
  }
}

// Curried function
const add5 = add(5);

console.log(add5(3)); // Output: 8
console.log(add5(7)); // Output: 12

In the above example, add(5) will return a function having x=5 predefined, and then we will assign a value of y using add5(3).

Now look at another example:

function multiply(a){
    return function(b){
        console.log(a * b);
    }
}

multiply(2)(10);

In the above example, a is equal to 2 and b is equal to 10.

##

More from this blog

J

JSpoint

53 posts

Discover the power of JavaScript with our comprehensive website. Explore resources and practical examples to enhance your coding skills. From frontend development to backend scripting.