 # Do not understand Currying

Tell us what’s happening:
I’m not understanding this challenge.
Your code so far

``````
function add(x) {
// Only change code below this line
var y = x + x;
var z = x + y;
var partialFn = x.bind(this, y, z);
return partialFn;

// Only change code above this line
}
add(10)(20);
console.log(add(10)(20));
``````
``````  **Your browser information:**
``````

User Agent is: `Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15`.

Challenge: Introduction to Currying and Partial Application

Link to the challenge:

Can you be more specific?

Yeah, currying is weird. There are different ways to think about it, but here you can think of it that instead of having 1 function that takes 2 parameters, they make two functions that each take one parameter - the first function takes 1 parameter each and the first function returns the second function.

``````const unCurried = (x, y) => x + y;
console.log(unCurried(1, 2));
// 3

// ***

const curried = x =>
y => x + y;
console.log(curried(1)(2));
// 3

// ***

function curried2(x) {
return function(y) {
return x + y;
}
}
console.log(curried2(1)(2));
// 3

// ***

const returnedFunction = curried(1);
const answer = returnedFunction(2);
console.log(answer);
// 3
``````

The first example is of course a “normal” function, one function taking one parameter.

The second example is of course a curried function. Notice that there are two functions - the first returning the second. The second returned function is `y => x + y;` and it is returned by the first half, `x =>`. So, `f(x, y)` becomes `f(x)(y)`. `f(x)` returns a function that gets executed by the `(y)`.

The third example is the same as the second but written out with standard JS functions.

The last shows that you can run those functions separately. I can run the first one that returns a function and I can execute it later. It may not be clear now, but that does come in handy.

1 Like

Is it specifically the partial application using bind part you do not understand?

`bind` returns a new bound function that can have pre-specified initial arguments.

``````function greeter(message, honorific, name) {
console.log(message, honorific, name); // Hello Mr Bond
}
var greeterFn = greeter.bind(null, 'Hello', 'Mr');
greeterFn('Bond');
``````

You can see the `[[BoundArgs]]` if you log out the return function as an object.

`console.log({greeterFn});` 1 Like

The challenge asks for 3 function. I don’t know how to make the third one.

This is what I tried

``````  // Only change code below this line
function(y) {
return x += y;
}
return function(z) {
return x + z
}
// Only change code above this line
``````

edit:
Tested your second example, and succeeded:

``````function add(x) {
// Only change code below this line
var add = y =>
z => y + z + x;
return add;

// Only change code above this line
}
add(10)(20)(30);
console.log(add(10)(20)(30));
``````

Right, it has three parameters so instead of a function returning a function (in my example) it will be a function returning a function returning a function (like in your last example). Good job.

But yeah, they’re confusing and it won’t really sink in until you use it a few times. And to be honest, it doesn’t get used a lot. But when it does come in handy, it can be an awesome tool.

1 Like