5

As many as Articles as i've read , I still have some questions.

I already know (and understand) the usages of closure like :

  1. The Infamous Loop Problem ( loop of links with alert on each one of them with kept number)

  2. increased counter (keep calling a function -> which alerts increased numbers)

From here :

inner functions referring to local variables of its outer function create closures

From here :

a closure is the local variables for a function - kept alive after the function has returned, or a closure is a stack-frame which is not deallocated when the function returns. (as if a 'stack-frame' were malloc'ed instead of being on the stack!)

3 Questions please:

Question #1

I was told that all functions in JS create Closures.

WHAT ??? if I create a normal function with private variable it just create a scope. not closure.

I thought that closure work like this:(from here)

  1. Make an outer, "function maker" function.
  2. Declare a local variable inside it.
  3. Declare an inner function inside the outer one.
  4. Use the outer function's variable inside the inner function.
  5. Have the outer function return the inner function
  6. Run the function, and assign its return value to a variable

exmample:

function functionMaker(){
   var x = 1;
   function innerFunction(){
     alert(x);
     x++;
   }
   return innerFunction;
}

So why do they say that every js function create closure ?

Question #2

Does Self-Invoking Functions aka IEFA - Immediately Invoked Function Expression creates a closure ?

looking at

(function (a) {
    alert(a);
})(4);

I don't see the pattern like the 6 rules from the above : where exactly Have the outer function return the inner function is here ? I dont see the word return.

Question #3

function myFunction() {
  var myVar = 1;
  var alertMyVar = function () {
    alert('My variable has the value ' + myVar);
  };
  setTimeout(alertMyVar, 1000 * 3600 * 24);
}
myFunction();

Does myFunction was alive for the whole day here ? or it was ended as soon after the setTimeout ? and if so , how did SetTimeOut remembered that value ?

Please help me to get it right.

Royi Namir
  • 144,742
  • 138
  • 468
  • 792

1 Answers1

8

All function calls create a closure. The important thing to note is whether the closure lasts beyond the lifetime of the function call.

If I do an immediately-executed function:

var value = (function() {
  return 4;
})();

then a closure is created, but discarded when the function returns. Why? Because there are no surviving references to symbols defined in the closure. But here:

var value = function() {
  var counter = 0;
  return function() {
    return counter++;
  };
}();

the closure lives on after the immediately executed function, because it returns another function that, in turn, includes references to the "counter" symbol defined in the original function. Because that returned function is still "alive", the closure has to be retained by the runtime system.

Note that here:

var value = function() {
  return function(a) {
    return "hello " + a;
  };
}();

even though the outer immediately executed function returns a function, that function doesn't reference any symbols from the outer one, so there's no need to preserve the closure.

I guess what I'm trying to say is that it's helpful to think about the closure as part of the effect of executing a function, rather than strictly as a static, structural thing. It's possible to have a function that sometimes creates a persistent closure, but not always.

Pointy
  • 405,095
  • 59
  • 585
  • 614
  • Thanks. is it related to my 3'rd question ? `beyond the lifetime of the function call` ? – Royi Namir Nov 21 '12 at 15:07
  • Remember: JavaScript IIFEs must have parentheses: `(function() {})();` – Waleed Khan Nov 21 '12 at 15:08
  • 2
    @WaleedKhan no, that is not true. It's only necessary to disambiguate the `function` keyword. On the right side of an `=` expression there is no ambiguity, so the parentheses are not necessary. – Pointy Nov 21 '12 at 15:09
  • @Pointy Well it appears to be true in Mobile Safari EDIT: I stand corrected. – Waleed Khan Nov 21 '12 at 15:12
  • @RoyiNamir All of your questions are related to each other :-) Every function call creates a closure. – Pointy Nov 21 '12 at 15:12
  • @WaleedKhan your example in the jsfiddle is not the same as my code. Try `var x = function() { ... }();` - that will work fine. – Pointy Nov 21 '12 at 15:12
  • @Pointy ( please follow me on this one ) - If i argue with a friend from work - by saying _"this is not a closure"_ ( like your first example) and this **is** a closure ( remembering a state - like your second example) - What should I tell him ? its a closure but not ________ ( im looking the professional term) – Royi Namir Nov 21 '12 at 15:22
  • Hmm well maybe think in terms of memory allocation/garbage collection. If you create an object, then when no variable contains a reference to the object, it can be reclaimed by the garbage collector. The closure is like that - if there are no references to anything declared in the closure, it can be garbage collected; otherwise, it can't. – Pointy Nov 21 '12 at 15:25
  • @Pointy Can I FORCE Garbage Collect in JS ? – Royi Namir Nov 21 '12 at 15:27
  • Oh also, the runtime may be able to tell from the code that it's not possible for the closure to "survive" the function call, so there may be optimizations that result in a closure "object" not being created sometimes. That's all transparent however. – Pointy Nov 21 '12 at 15:27
  • @RoyiNamir no, as far as I know there's no API or anything that tells the runtime system to do a garbage collection. Java has something like that, but not JavaScript. (Perhaps V8 or some other runtimes have special APIs, but they're not standard as far as I know.) – Pointy Nov 21 '12 at 15:28
  • @Pointy I still dont understand in my 3'rd question - how the `setTimeout` remembered that value........... :( – Royi Namir Nov 21 '12 at 15:29
  • @RoyiNamir well `setTimeout()` is just a function - you're *passing* that inner function as a parameter, and `setTimeout()` keeps a global table of timer handler functions. It's as if you copied a reference to the inner function to a global variable, in other words. – Pointy Nov 21 '12 at 15:32
  • @Pointy Hi. I'll be glad to get an answer from you about http://stackoverflow.com/questions/13506852/infinite-timer-loop-with-javascript-no-setinterval – Royi Namir Nov 22 '12 at 07:26
  • does closures work for reference types? please see this post http://stackoverflow.com/questions/20790386/javascript-closures-and-object-reference/20790832 – mobygeek Dec 26 '13 at 21:25