0

In the simple, 2 layer currying example below the word dog is passed into the y argument. 

"use strict";

function layer2(x) {
    return function(y) {
        return console.log(x, y);
    }
}

var layer1 = layer2('cat');

layer1('dog');

I know it works this way and I can reliably reproduce this. However I can't understand the mechanics of why this works. If I made a 100 layer example layer 1 would be the innermost function and the pattern would work outwards from that point. What piece of basic mechanics causes this? Thanks so much for any input!

DR01D
  • 1,325
  • 15
  • 32
  • I read the post twice but still don't know what is the question. Can you please be a bit more specific – Rajesh Dec 22 '17 at 05:05
  • It utilizes the concept of closure in javascript for currying the function – ricky Dec 22 '17 at 05:07
  • 2
    Possible duplicate of [How do JavaScript closures work?](https://stackoverflow.com/questions/111102/how-do-javascript-closures-work) – Rajesh Dec 22 '17 at 05:09

2 Answers2

2

It's simple. When you call layer2('cat') it will return the function:

function(y) {
  return console.log(x, y);
}

Now, layer1('dog') returns function call return console.log(x,y); on which x is received already in a call layer2('cat'), and y is being called from function(y).

Here's a very good read blog https://javascriptweblog.wordpress.com/2010/10/25/understanding-javascript-closures/ which will help you further.

Bhojendra Rauniyar
  • 83,432
  • 35
  • 168
  • 231
  • Please chose to close instead of answering. Since you know the solution, you are more likely to find better dupe. – Rajesh Dec 22 '17 at 05:12
  • That makes perfect sense! Now I can see how the returns are stepping backwards. Thanks so much! I'll read the link now. – DR01D Dec 22 '17 at 05:16
2

In short, lexical scoping is what makes this possible. See, layer2 function in your example returns another function that has two variables in its scope:

y - its own argument
x - parameter passed into `layer2` function

The key point here is that once you store that returned function, x value is set and will never change. Again, in terms of your example, function stored in layer1 variable - result of layer2('cat') - has x name bound to 'cat' string value.

raina77ow
  • 103,633
  • 15
  • 192
  • 229
  • 1
    Please chose to close instead of answering. Since you know the solution, you are more likely to find proper dupe. – Rajesh Dec 22 '17 at 05:12
  • 1
    I considered this to be a different question - not 'what closures are', but rather 'what makes currying possible'. And my closing vote will be binding (close this question immediately), hence no action. I upvoted your comment however, as understanding how closure works is crucial to understanding how currying works in JS. – raina77ow Dec 22 '17 at 05:15
  • The two answers to this question have helped me immensely! I understand the concept of closure and can see how it applies to this. But until these answers I was not picking up on that at all. Thanks so much! – DR01D Dec 22 '17 at 05:18
  • 1
    You're welcome. BTW, your example shows not currying, but partial application; those are similar, but [a bit different beasts](https://stackoverflow.com/questions/218025/what-is-the-difference-between-currying-and-partial-application). – raina77ow Dec 22 '17 at 05:21
  • Considering the fact that curring functions rely on closure scope, understanding them will explain you how currying works. Hence marked it as dupe. But its just my POV. Have a good day. ;-) – Rajesh Dec 22 '17 at 05:22