Surprised that global variable has undefined value in JavaScript

Question

Today, I got completely surprised when I saw that a global variable has undefined value in certain case.

Example:

var value = 10;
functi         


        

Answer 1

There is a global variable value, but when control enters the test function, another value variable is declared, which shadows the global one. Since variable declarations (but not assignments) in JavaScript are hoisted to the top of scope in which they are declared:

//value == undefined (global)
var value = 10;
//value == 10 (global)

function test() {
    //value == undefined (local)
    var value = 20;
    //value == 20 (local)
}
//value == 10 (global)

Note that the same is true of function declarations, which means you can call a function before it appears to be defined in your code:

test(); //Call the function before it appears in the source
function test() {
    //Do stuff
}

It's also worth noting that when you combine the two into a function expression, the variable will be undefined until the assignment takes place, so you can't call the function until that happens:

var test = function() {
    //Do stuff
};
test(); //Have to call the function after the assignment