closure question

[JavascriptProgrammer]

In the following code:
-----------------------
function get() {
return function() {
alert(x);
}
};
function foo(s) {
var x = s;
this.getX = get();
}
var f = new foo("hello");
f.getX()
--------------------------

Instead of printing "hello", f.getX() gives a JS error
of ("x is not defined").

Can someone explain Why in detail ?

 

[RobG]

In the following code:

The x here is not declared, so when the function is called it will go
looking for it on its scope chain.

        }};

function foo(s) {
        var x = s;

x here is a local variable of the function foo.

        this.getX = get();
        }
var f = new foo("hello");

f doesn't have an x property, it was declared as a property of the
constructor. The function get() was called from inside the
constructor, but since it's declared outside the constructor, it
doesn't have a closure to x.

f.getX()

'cos it ain't.

Move the function declaration for get inside the constructor, or use a
statement:


function foo(s) {

function get() {
return function() {
alert(x);
}
}

var x = s;
this.getX = get();
}


or, for simplicity's sake:

function foo(s) {
this.getX = function() {
alert(s);
}
}

Can someone explain Why in detail ?

There is no closure. Closures are created by how you declare a
function, not by how you call it. To create a closure, you declare a
function (or use a function expression) inside another function:

function foo() {
var x;
function bar() { // Create a closure
alert(x); // Use it to access foo's x
}
}

 

[Joost Diepenmaat]

What you expected would indeed be correct in a dynamically scoped
language, but JavaScript uses lexical scope. Here's a good explanation
of the difference between the two:

http://en.wikipedia.org/wiki/Scope_(programming)

Correct. And to expand a bit, as far as I know closures are /defined/ to
work on lexicals. You can do similar things with dynamic variables (if
your language supports them) but many of the really interesting uses of
anonymous functions require lexical scope and closures:


function make_closure() {
var i = 0;
return function () { return ++i };
}

var c1 = make_closure();
c1(); // 1

var c2 = make_closure();
c2(); // 1

c1(); // 2
c1(); // etc...
c2();
c1();

See also:
http://en.wikipedia.org/wiki/Closure_(computer_science)

 

[Thomas 'PointedEars' Lahn]

function foo(s) {
var x = s;

x here is a local variable of the function foo.

this.getX = get();
}
var f = new foo("hello");

f doesn't have an x property, it was declared as a property of the
constructor. [...]

Because `x' was declared a local variable of the constructor's *execution
context*, it became a property of its *Variable Object*. As became `s', BTW.


PointedEars