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
A 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'
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With