2

I have found a script example, in it there is a line of code that looks something like this:

fn = (arg1) => (arg2) => {
    //do something with arg1 and arg2
}

I am wondering exactly what is happening here, and how would it look as a "normal" function?

Winter
  • 2,407
  • 1
  • 19
  • 28
  • related: [What do multiple arrow functions mean in javascript?](http://stackoverflow.com/questions/32782922/what-do-multiple-arrow-functions-mean-in-javascript) –  Mar 27 '17 at 13:31

3 Answers3

6

It looks like two nested function, where the outer function returns the inner function with a closure over arg1.

var fn = function (arg1) {
        return function (arg2) {
            //do something with arg1 and arg2
        };
    };


var fn = function (arg1) {
        return function (arg2) {
            return arg1 + arg2;
        };
    };


var add4 = fn(4),
    add20 = fn(20);

console.log(add4(5));  //  9
console.log(add20(5)); // 25

Arrow function:

An arrow function expression has a shorter syntax than a function expression and does not bind its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.

Nina Scholz
  • 376,160
  • 25
  • 347
  • 392
  • nice example, but the other answer mentions some difference in `this`, do you know what it means? – Winter Mar 27 '17 at 08:38
  • @Winter Out of scope for this question / comments. Give [this question](http://stackoverflow.com/questions/34361379/arrow-function-vs-function-declaration-expressions-are-they-equivalent-exch) a read. – CodingIntrigue Mar 27 '17 at 08:48
6
fn = (arg1) => (arg2) => {
    //do something with arg1 and arg2
}

fn is a name for the first anon function its basically a function that returns another function

it translated roughly to 

var fn = function(arg1){
  return function(arg2){
    ... // do something 
  }
}

noting that the this value will differ because it is an arrow function .

Ahmed Eid
  • 4,414
  • 3
  • 28
  • 34
  • tx, but what is it that happens with `this`? – Winter Mar 27 '17 at 08:36
  • arrow function does not bind its own this unlike regular functions . – Ahmed Eid Mar 27 '17 at 08:38
  • so, in the first example `this`would refer to fn, whereas `this`inside the return function in the second example will refer to the return function itself? – Winter Mar 27 '17 at 08:43
  • regular functions in javascript introduce their own this depending on how they are called , but arrow functions don't , if you call this inside an arrow function it will treat it as a regular variable and go look for in outer scope . – Ahmed Eid Mar 27 '17 at 08:49
  • http://exploringjs.com/es6/ch_arrow-functions.html https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions – Ahmed Eid Mar 27 '17 at 08:53
-1

I cannot add comments so I write this as an answer. Your example is also known as currying a concept that allows you to pass in a subset of arguments to a function and get a function back that’s waiting for the rest of the arguments.

CodingIntrigue
  • 75,930
  • 30
  • 170
  • 176
FrankCamara
  • 348
  • 4
  • 9
  • If you don't have enough rep to add comments, you need to gain rep by adding *valid answers*. In fact, if you just added some example code to answer the OP's question this would be a perfectly good answer – CodingIntrigue Mar 27 '17 at 08:49
  • exactly that is currying . – Ahmed Eid Mar 27 '17 at 08:51
  • @CodingIntrigue Yea I've figured that out, but what I dont understand is why I get -1 when I give valid answers. Its wierd? When do you normally use let fn = (arg1) => (arg2)? If you know about the currying concept, it is easier for you to understand the example code, isnt it? – FrankCamara Mar 27 '17 at 08:53
  • People feel that this doesn't quite answer the question. The question is `I am wondering exactly what is happening here, and how would it look as a "normal" function?` If you asked me that and I said `it's also known as currying` I'm pretty sure you'd give me a quizical look :) It's certainly correct, it's just it is a footnote to the actual answer - you should look at the upvoted answers here so see how they differ. – CodingIntrigue Mar 27 '17 at 08:56
  • CodingIntrigue yes and that is exactly why I wrote 'I cannot add comments...', because my answer is a sidenote, so people who is reading this question gets to know about the concept and can understand the 'what is happening here' part in the question. – FrankCamara Mar 27 '17 at 08:59
  • That's what comments are for. I know it's frustrating, but if the only thing you have to add is a comment you just need to hold off at first & only add valid answers. Once you get a few of those (it's not too many), then you can add as many comments as needed :) – CodingIntrigue Mar 27 '17 at 09:01
  • true, it is really frustrating, thanks =) I will work on my rep. – FrankCamara Mar 27 '17 at 09:03
  • "_currying a concept that allows you to pass in a subset of arguments to a function and get a function back that’s waiting for the rest of the arguments._" I'd upvote, but your definition of currying is wrong. What you describe is actually partial application. –  Mar 27 '17 at 13:27