Understanding currying patterns in JavaScript

Tram Ho

In functional programming, the currying pattern is a way to write functions so that their arguments can be partially applied. This means that you can create a new function by supplying some, but not all, of the arguments that the original function expects. This helps create more specific functions that can be reused in different parts of your code.

What is Currying?

Currying is the process of transforming a function expecting multiple arguments into a sequence of functions each expecting only one argument. For example, consider the function This function adds two numbers together.

To curry this function, write a new function that takes the first argument x and have it return a new function that expects the second argument y . You can do it like this.

Now, instead of calling add(x, y) , we can call add(x)(y) . This seems like a small change, but it allows you to do some interesting things.

Benefits of Currying

Using the currying pattern has several advantages.

1. Reusable functions

One of the main benefits of currying is that it allows you to create more specific functions that can be reused in different parts of your code. For example, consider the function This function multiplies a number by 10.

This function is specialized for multiplying by 10 and cannot be multiplied by other numbers. However, by currying this function, we can create a more general function that can multiply any number.

In this state, we have two specific functions, multiplyBy10 and multiplyBy5 , which we can reuse throughout our code.

2. Combinability

Another benefit of currying is that you can easily combine new functions from existing functions. For example, consider a function that adds and multiplies numbers like this:

Currying can be used to create a new function that multiplies two numbers and adds a third number to the result.

Now to perform the calculation (2 * 3) + 4 you can call multiplyAndAdd(2)(3)(4) .

Real world example of currying in JavaScript

Now that we’ve learned the basics of currying and its benefits, let’s look at some real-world examples of how to use this pattern in JavaScript code.

1. Partial function application

A common use of currying is to create a new function with some arguments prefilled. This is called partial function application.

For example, consider the function This function calculates the total amount including tax.

If you want to create a new function that calculates the total cost of an order at a given tax rate, you can do this using currying.

Currently, to get the total cost of an order with a price of $100 and a tax rate of 8% , you can call calculateTotalWithTax(100) .

2. Creating higher-order functions

A common use of currying is to create higher-order functions, which are functions that take other functions as arguments or return them as outputs.

For example, consider the function This function takes an array of numbers and a callback function and returns a new array with the callback function applied to each element.

Currying can be used to create new functions with pre-filled callback arguments.

Now you can get the array [2, 4, 6] by calling mapWithMultiplyBy2([1, 2, 3]) .

3. Creating event handlers

Currying can also be useful for creating event handlers in React and other JavaScript libraries.

For example, consider the function This function handles the click event of the button.

Currying can be used to create a new function with the id and name arguments pre-filled.

Passing handleClickWithIdAndName to the onClick property now ensures that the appropriate message is logged when the button is clicked.

4. Creating custom iterators

Currying can also be useful in creating custom iterators in JavaScript.

For example, consider the function This function iterates over an array of numbers and returns the sum.

Currying can be used to create a new function that iterates over an array and applies a callback function to each element.

Currently you can get the sum of the array [2, 3, 4] by calling sum([1, 2, 3]) .

Conclusion

In this article, we learned how the currying pattern is used in JavaScript to create more specific and reusable functions and improve code commutativity and readability. We’ve also seen some practical examples of how this pattern applies in real-world situations. Currying can take some time to learn, but it can be a powerful tool in your functional programming workflow.

As always, I hope you enjoyed this article and learned something new.

Thank you very much. See you in the next article!

If you like this article, please support us by liking and subscribing. thank you.

Ref

Share the news now

Source : Viblo