ECMAScript is pretty straightforward about var
. If you don't use var
inside a function to declare a variable you assign to you assign to the global scope. This happens because of the way chain scoping works. The executing environment looks for the identifier in the local scope and then moves up until it reaches the global scope. If hasn't found a declaration for the the identifier and it's not identified as an argument the variable is created in the global scope.
For example local scope:
var car = 'Blue';
function change_color () {
var car = 'Red';
}
change_color();
console.log(car); //logs 'Blue' as car is in the local scope of the function.
When car
is not found in the local scope:
var car = 'Blue';
function change_color () {
car = 'Red';
}
change_color();
console.log(car);
//logs 'Red' as car is not in the local scope and the global variable is used.
Now apparently there's an exception to this rule that I wasn't aware of and don't understand (notice the function name):
var car = 'Blue';
(function car () {
car = 'Red';
})();
console.log(car); //Logs 'Blue'????
Can anyone explain this please? I don't see where this is explained in the ECMASpec. Tested in Chrome 8 and Firefox 3.6
ECMAScript is pretty straightforward about var
. If you don't use var
inside a function to declare a variable you assign to you assign to the global scope. This happens because of the way chain scoping works. The executing environment looks for the identifier in the local scope and then moves up until it reaches the global scope. If hasn't found a declaration for the the identifier and it's not identified as an argument the variable is created in the global scope.
For example local scope:
var car = 'Blue';
function change_color () {
var car = 'Red';
}
change_color();
console.log(car); //logs 'Blue' as car is in the local scope of the function.
When car
is not found in the local scope:
var car = 'Blue';
function change_color () {
car = 'Red';
}
change_color();
console.log(car);
//logs 'Red' as car is not in the local scope and the global variable is used.
Now apparently there's an exception to this rule that I wasn't aware of and don't understand (notice the function name):
var car = 'Blue';
(function car () {
car = 'Red';
})();
console.log(car); //Logs 'Blue'????
Can anyone explain this please? I don't see where this is explained in the ECMASpec. Tested in Chrome 8 and Firefox 3.6
Share asked Nov 18, 2010 at 2:06 BjornBjorn 72.1k40 gold badges140 silver badges165 bronze badges 01 Answer
Reset to default 7A named function expression (unlike a function declaration) creates a name which is only available within the scope of the function.
An expression (not declaration) of the form (function foo() { ... })
creates an identifier named foo
which only exists inside the function.
Therefore, when you assign to foo
inside the function, you're assigning to this local identifier.
If you change your function to a function declaration, it will work as you expect:
var car = 'Blue';
function car () {
car = 'Red';
}
car();
console.log(car); //Logs 'Red'