JavaScript: The Definitive Guide, Fourth Edition

Variable Scope

The scope of a variable is the region of your program in which it is defined. A global variable has global scope -- it is defined everywhere in your JavaScript code. On the other hand, variables declared within a function are defined only within the body of the function. They are local variables and have local scope. Function parameters also count as local variables and are defined only within the body of the function.

Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable. For example, the following code prints the word “local”:

var scope = "global";         // Declare a global variable
function checkscope(  ) {
    var scope = "local";      // Declare a local variable with the same name
    document.write(scope);    // Use the local variable, not the global one
}
checkscope(  );               // Prints "local"

Although you can get away with not using the var statement when you write code in the global scope, you must always use var to declare local variables. Consider what happens if you don’t:

scope = "global"; // Declare a global variable, even without var function checkscope( ) { scope = "local"; // Oops! We just changed the global variable document.write(scope); // Uses the global variable myscope = "local"; // This implicitly declares a new global variable document.write(myscope); // Uses the new global variable ...