2

In an answer to this question, I can see the value of i being retained by sort of throwing it into another function:

var funcs = [];

function createfunc(i) {
    return function() { console.log("My value: " + i); };
}

for (var i = 0; i < 3; i++) {
    funcs[i] = createfunc(i);
}

for (var j = 0; j < 3; j++) {
    funcs[j]();                        // and now let's run each one to see
}

http://jsbin.com/raxifitaberu/1/edit

Why does the function createfunc() need to return another function? Why is that any better than just returning the string:

 var myArray = [];

 function createFunc(i){
    return "My value: " + i; 
};

 for (var i = 0; i < 5; i++){
     myArray[i]=createFunc(i);        
 }

 console.log(myArray[0]);
 console.log(myArray[1]);
 console.log(myArray[2]);

http://jsbin.com/demiloronohe/1/edit

Is there some advantage to putting function behind the return?

Community
  • 1
  • 1
1252748
  • 14,597
  • 32
  • 109
  • 229
  • It's just a simple example. In a more complex situation the returned function may require additional parameters. For this case you could just return strings, but that would not illustrate how closures work ,-) – Sirko Aug 30 '14 at 17:51
  • @Sirko How does the second example not illustrate a closure? It seems like it is holding the value of `i` same as the returned functions – 1252748 Aug 30 '14 at 17:58
  • The second example is just a function call and retain a pointer for the (string) result. Maybe read [How do JavaScript closures work?](http://stackoverflow.com/q/111102/1169798) for some more clarity on what a closure actually is. – Sirko Aug 30 '14 at 18:14

2 Answers2

1

In your example it's indeed not necessary, as the function returns a constant expression (Ignoring the side effect of executing console.log and taking that as a "return" value)

However, we could give it a parameter and involve some logic:

var funcs = [];

function createfunc(i) {
    return function(j) {
        if (i == j) console.log("You've found " + i);
        else console.log("I'm not " + j);
    };
}

for (var i = 0; i < 3; i++)
    funcs[i] = createfunc(i);
for (var j = 0; j < 3; j++)
    funcs[j](2);

I hope it is getting more clear now. Of course, you can always avoid closures by capturing their state in an explicit data object (the strings in your example) and passing these then to plain functions as an extra argument (the console.log that you moved into the loop) when you otherwise would just have executed the closure.

Bergi
  • 630,263
  • 148
  • 957
  • 1,375
0

As @sirko mentioned in his comments in a case like bellow it won't work.

 var myArray = [];

 function createFunc(i){
    return function(b){
        return i + b;
    }
};

 for (var i = 0; i < 5; i++){
     myArray[i] = createFunc(i);
 }

 for (var j = 0; j < 5; j++){
     console.log(myArray[j](j));
 }

So here you need to return the answer according to the parameter given to the inner function. That is the case @sirko wanted to point out, correct me if I am wrong.

Mritunjay
  • 25,338
  • 7
  • 55
  • 68