3

The example below was taken from a StackOverflow answer which helps to identify a closure.

for (var i = 0; i < 10; i++) {
    (function f() {
        var i2 = i;
        setTimeout(function g() {
            console.log(i2);
        }, 1000);
    })();
}

The following explanation was given:

For g:

List the variables: console is a free variable. i2 is a free variable. Find the parent scope to which each free variable is bound: console is bound to the global scope. i2 is bound to the scope of f. In which scope is the function referenced? The scope of setTimeout. Hence console is not closed over by g. Hence i2 is closed over by g.

However I am not able to understand the bolded part - could you explain it to me?

Community
  • 1
  • 1
user3601733
  • 189
  • 1
  • 1
  • 9
  • 1
    What answer is this taken from? Please link it when you quote it. – Bergi May 29 '14 at 18:29
  • 1
    For reference, this is the answer that content is from: http://stackoverflow.com/a/12931785/1317805 – James Donnelly May 29 '14 at 18:30
  • i know this is duplicate and i read ur link before you published,But i need to understand the lines i provided in the exampe – user3601733 May 29 '14 at 18:31
  • You might want to have a look at [this answer](http://stackoverflow.com/a/16587104/1048572) to understand what the question "*In which scope is the function referenced?*" means. Basically, do you have access to the free variables **from where the function is called**? – Bergi May 29 '14 at 18:53
  • @user3601733: there are many answers to the question you linked to, some of the others may provide a better explanation. Remember that just because an answer has been accepted doesn't mean it's the easiest to understand. – Qantas 94 Heavy May 29 '14 at 22:35

1 Answers1

1

The term "closed-over" variable in that post means that the variable is not accessible by the caller of the function; it is neither seen nor modifiable from the context where the function is being called. Let's modify the code slightly:

var mySetTimeout = function (func, timeout) {
    console.log = function (arg) { alert(arg); };
    i = "foobar";
    i2 = "barfoo";
    setTimeout(func, timeout);
};

var i = "peekaboo";

(function f() {
    var i2 = i;
    mySetTimeout(function g() {
        console.log(i2);
    }, 1000);
})();

Instead of setTimeout, the function f calls mySetTimeout that tries to change both the value being logged after the timeout elapses, and the logging function.

After the function f has been called and it has returned, only the function g can see and modify the variable i2. However console is not closed over, because it is a value in the global scope; if you execute console.log = function (i) { alert(i); };, you will get alert box when the timeout fires. However, you cannot read or modify i2 in myTimeout - that function does not see the same variable at all.

  • ; if you execute console.log = function (i) { alert(i); };, you will get alert box when the timeout fires. However, you cannot modify i2 in any way..I could not understand this part can u explain it to me thanx – user3601733 May 30 '14 at 02:45