Passing local variable with name of a global varia

Question

foo = "foobar";
var bar = function(){
    var foo = foo || "";
    return foo;
}
bar();`

This code gives a result empty string. Why cannot JS reassign a local variable with same name as a global variable? In other programming languages the expected result is of course "foobar", why does JS behave like that?

Answer 1

That's because you declared a local variable with the same name - and it masks the global variable. So when you write foo you refer to the local variable. That's true even if you write it before the declaration of that local variable, variables in JavaScript are function-scoped. However, you can use the fact that global variables are properties of the global object (window):

var foo = window.foo || "";

window.foo refers to the global variable here.

Answer 2

Once interpreter sees var foo it assumes foo is a local variable. Why? The answer is simple: because that's how this language has been constructed. (and no, it is not the only language that works this way)