1

Can someone please explain the below 'Currying' function. When I set a break point, I can see values 'b' and 'c' are undefined and returned. But how does the system get the value 7 for 'b' and 9 for 'c' in this case. Its printing the correct result for 5*7*9, ie 315 in console.

function multiply(a){
    return function (b){
        return function (c) {       
            return a*b*c ;
                }
        }
    }
var answer = multiply(5)(7)(9);
console.log(answer);
8
  • 2
    Which part is tripping you up? You understand that the first 2 calls return functions? Commented Aug 24, 2018 at 1:26
  • While setting the break point and hover over 'b' it says 'b' undefined and system operation return to multiply ()..I got confused how system understand and need to grab the value for b in this case ? Commented Aug 24, 2018 at 1:30
  • 2
    The break point showing undefined is probably just due to a limitation of the debugger. By the time a*b*c is run, the parameters a, b and c will all have numeric values in this case. And I don't understand what you mean by the "how system understand and need to grab..." part. b is just a parameter of the function. The fact that the functions are nested doesn't change that. Commented Aug 24, 2018 at 1:32
  • You can verify that they all have proper values by putting console.log(a, b, c) before the multiplication line. Commented Aug 24, 2018 at 1:35
  • 1
    Not sure if it helps but I found arrow function syntax (const multiply = (a) => (b) => (c) => a*b*c;) made it a lot clearer to me what I was doing. Commented Aug 24, 2018 at 1:41

3 Answers 3

2

When you call multiply(5) a function is returned and that function is immediately called with multiply(5)(7) and have access to a and b, then a new function is returned and is also immediately called when multiply(5)(7)(9) and has access to a, b, and c.

The answer to why the nested functions have access to parent function parameters is closures. Please check this other question/answers about closures in javascript: link.

Sign up to request clarification or add additional context in comments.

Comments

2

You can understand currying if you assign each intermediate result to a variable. Rewrite the function calls like this:

var x = multiply(5)
var y = x(7);
var answer = y(9);

Now it is more clear that the result of calling multiply(5) is a function. We call it with x(7) which passes the value of 7 to b. This results in another function which we call with y(9) which in turn passes the value of 9 to c and returns the final result.

Comments

2

When you call the multiply function, the important thing is each function returns an anonymous function. It will be easier if you give them names.

function multiplyA(a){
    return function multiplyB(b){
        return function multiplyC(c) {       
            return a*b*c ;
        }
    }
}

// When you call multiplyA(5)(7)(9)
// From the first, multiplyA(5) returns multiplyB with scope with multiplyA
// just like below

const a = 5;
const multiplyB = function(b){
    return function multiplyC(c) {       
        return a*b*c ;
    }
}

// Once more call multiplyB(7)
// It also returns function named multiplyC

const a = 5;
const b = 7;
const multiplyC = function(c) {
    return a * b * c;
}

// Finally call mulitplyC(9) means 5 * 7 * 9

To understand it, closure and function scope will be helpful.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.