What is Currying in JavaScript? | JavaScript Interview Question

Have you ever played a game where you first configure the settings step by step?

• set the difficulty level
• choose your character
• choose their attire or weapon

Each step configures one thing before moving to the next.

Interestingly, currying in JavaScript works in a very similar way.

Instead of passing all arguments to a function at once, we pass them one at a time, and each step returns another function that knows what has already been configured.

In simple terms:

Currying transforms a function with multiple arguments into a sequence of functions, each taking one argument at a time.

This approach can make functions more reusable, flexible, and composable, especially in functional programming.

Let’s understand this concept with a simple example.

Practical Example of Currying

// This is a Curried function to apply game settings
const configureGame = propertyName => value => settings => {
  return {
    ...settings,
    [propertyName]: value
  };
};

// game object
let settings = {};

// Creating configuration functions
const setSoundVolume = configureGame('soundVolume');
const setDifficulty = configureGame('difficulty');
const setCharacter = configureGame('character');

// Applying settings
settings = setSoundVolume(70)(settings);
settings = setDifficulty('hard')(settings);
settings = setCharacter('Fox')(settings);

console.log(settings);

The function configureGame is a curried function: This function does not take all arguments at once. Instead, it returns a series of functions, each accepting one argument.

Let’s break down the example step by step:

Step 1: Creating Reusable Functions

const setSoundVolume = configureGame('soundVolume');
const setDifficulty = configureGame('difficulty');
const setCharacter = configureGame('character');

Here, we call configureGame with the first argument 'soundVolume'. This returns a new function that takes the next argument (the value for soundVolume). Each of these functions is specialized for updating a specific setting.

value => settings => { ... }

Step 3: Applying Values and Updating the Settings Object Now we pass the value we want to update along with the current settings object.

settings = setSoundVolume(70)(settings);

This returns another function:

settings => {
  return {
    ...settings,
    soundVolume: 70
  };
}

This produces new settings object with the updated soundVolume property. We repeat this process for difficulty and character. And the final output will be:

{
  soundVolume: 70,
  difficulty: 'hard',
  character: 'Fox'
}

Short answer for your interview:

Currying is a functional programming technique in JavaScript where a function that takes multiple arguments is transformed into a sequence of functions that each take a single argument. This allows for more flexible and reusable code, as you can create specialized functions by partially applying arguments.