Currying in Javascript with examples
Tags: javascript, webdev, tutorial, functional
Published: 2020-03-14 23:36:27

---
canonical_url: https://ogzhanolguncu.com/blog/using-curry-the-functional-way
title: 'Currying in Javascript with examples'
---


###Prerequisites
__Knowledge of higher order functions and arrow functions are needed.__



Name curry doesn't come from the spice we know, it comes from [Haskell Curry ](Haskell Curry) a mathematician. Haskel Curry defines Currying as:
> "Currying is the technique of translating the evaluation of a function that takes multiple arguments into evaluating a sequence of functions, each with a single argument". 

Currying is actually a process of linking functions together to reduce the number of arguments they take by utilizing lambda calculus. This technique gives us an option to control how arguments are passed to functions. Enough chit chat let's see the code!

##Oldschool function

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/u2l7x9dnygwph6fkmnk2.PNG)

At first sight, this may look like functions inside the function but it's more than that. Each function has it's own scope so you can do whatever you want and not worry about changing the outer variables. Please, see [Closures](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures) for more detail. First, when we invoke <code>addNumber</code> it returns __<code>[Function]</code>__ because there are still two more function waiting to be executed. Also, __secondFunction__ returns __<code>[Function]</code>__ because function is still not resolved. But, when we call the function one last time it returns 30 because all the functions finally evaluated. 

I know what you are thinking right now. Saying things like "Why do I wanna define three variables just to get function result?". What if said there is an easier way to curry? 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/19u3p4azmvjgbl4mv8s3.PNG)

Ta-da. See? A lot cleaner and easier to read. Stay tight we are not done yet. 
We can do these similar actions using [Arrow Function](https://developer.mozilla.org/tr/docs/Web/JavaScript/Reference/Functions/Arrow_functions). 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6akjdre3g6e5l3vsj9v7.PNG)

Here, we're mapping -> filtering -> reducing <code>randomNumbers</code> array. Parameter __X__ takes <code>randomNumbers</code> array, __Y__ takes a value to map over the array with a given value which is __2__ and returns a mapped version of <code>randomNumbers</code>, __Z__ filters out numbers only dividable by given number, in that case, __3__ and finally, __D__ takes an initial starting value __4__. 

We're not done yet. What if you wanted to __Un-curry__ the parameters? It's really easy. Check this out. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/308dm238jzieduffq5it.PNG)

Similar to destructuring, you specify the parameters you want.

One more, this is called __Partial Application__.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/qhv5q67ciqlfjo4hw4db.PNG)

Reducing your function to fewer parameters called partial application.

###Final Thoughts

To be honest, I've never used curry functions except for coding challenges but it's good to know how functional programming works.

Thanks for reading.