Javascript Global vs Local Scope

Question

I'm currently trying to understand Javascript's interesting take on global vs local scope.

My question is that why would the following returns undefined ?

var a = 100;
function local() {
    if (false) {
        var a = 50;
    }
    alert(a);
}

Additionally, I ran this:

var a = 100;
function local() {
    alert(a);
}

The result was a resounding: 100.

Is there some way that we can specify when we want the variable to be taken from the global scope, like a PHP global keyword, that we can use with Javascript?

Answer 1

Because of hoisting .

It means every variable declaration get's popped to the top of the function so the actual code that runs is:

var a = 100;
function local(){
    var a;
    if (false)
        a = 50;

    alert(a);
}

It has very little to do with global VS. local, you simply hid the outer a variable with the inner a variable.

Is there some way that we can specify when we want the variable to be taken from the global scope, like a PHP global keyword, that we can use with Javascript?

No

---

Regarding the question in the comment "In the case that I want to revert to using a global variable in case the if condition fails (which I intentionally did), how can I do so? " :

You can use eval :

var a = 100;
function local() {
    if (false) {
        eval('var a = 50;');
    }
    alert(a);
}

Live DEMO

But you should not!

Answer 2

JavaScript has function scope, not block scope (as many other programming languages). That means regardless where the var statement occurs (in your case, an if-branch that is not even executed), it declares a variable a in the function's local scope. It shadows the global a variable, but since it has no value assigned it returns undefined .

Is there some way that we can specify when we want the variable to be taken from the global scope, like a PHP global keyword, that we can use with Javascript?

You can access the variable as a property of the global object ( window in browser environments):

var a = 100; // global
function loc() {
    var a = 50;
    alert(window.a); // 100
    alert(a); // 50
}
loc();

However, you will hardly use this. Global variables are to be avoided in general, and in case of name clashes you should simply rename your local variable (for readability and maintainability at least).

Answer 3

I know that if a variable is in defined inside a function using var, then it will have Local Scope .

I also know that any function has easy access to Global variable.

When I tested following in Console of Browser, first output was undefined .

It means that function nwf() was unable to access Global variable nw1

This is due to reference error which highlights importance of Strict Mode

To avoid such scenario, never re-declare and/or initialize any variable with same name inside and outside any function, just unlike following:-

 var nw1 = 1; // var creates global scope outside function function nwf() { alert(nw1); var nw1 = 2; // var creates LOCAL scope inside function alert(nw1); }; nwf();