A study of the scope of JavaScript variables.

Begin

A variable's scope (scope) is the area in the program's source code that defines the variable. Global variables have global scope and are defined everywhere in JavaScript. However, variables declared within a function are defined only within the function body. They are local variables and the scope is local. The function parameter is also a local variable, and he is defined only in the function body. Here's a look at what I've tried and tested in these few areas.

1. Global variables can be accessed from anywhere, while local variables are not. Let's take a look at the following code:

    var global = "global";     function f () {        var local = "local";        alert (global);   // ==> The  global variable can be accessed by the     }    f ();     // ==> Error: Local is not defined    

2. Although global variables can be declared without Var, local variables must be declared with Var. Otherwise, if the declared local variable has the same name as a global variable, the global variable is modified, and if there is no global variable with the same name, a global variable is declared. Let's take a look at the following code:

    function f () {        = "local";  // without the Var declaration, the equivalent of declaring the global variable     }    f ();    alert (local);   //     var global = "global";     function F2 () {        = "local";  // without Var declaration and with the same name as the global globals variable is equivalent to modifying the global variables     }    f2 ();    alert (global);   // ==> "local"        

3. In the function body, the local variable takes precedence over the global variable with the same name. If a local variable or function parameter declared in the function body has the same name as a variable and a global variable, then the global variable is overwritten by the arrested variable. Let's take a look at the following code:

var scope = "global";        // declare a global variable    function f () {        var scope = "local";    // declare a local variable of the same name 　　        alert (scope); }    f ();                         // ==> "Local"

4. The Declaration of global variables in the function body is advanced. It may be strange to say in advance. Let's take a look at a classic JavaScript interview question:

    var scope = "global";     function f () {        alert (scope);         var scope = "local";        alert (scope);    }    f ();    

You might mistakenly assume that the first row in the function outputs "global" because the code has to run to the VAR statement to declare the local variables. In fact, because of the function scope, local variables are always defined in the whole function body, that is, local variables in the function body overwrite the global variables, only the VAR statement is executed to assign the value. So the code is equivalent to the following code:

    function F2 () {        var  scope;                   alert (scope);             // undefined        Scope = "local";        // Local         alert (scope);                }    F2 ();    

Understand, so experienced programmers will be in the function body of the declaration will advance to the front, this is a good coding habits.

5. What about the names of function parameters and declared local variables?

    function F (t) {        alert (t);         var T;        Alert (t)    }    function  f2 (t) {        alert (t);         var t =;        Alert (t);    }    F (a);    F2 (20);    

Check the results: F ()-->20, 20; F2 ()-->20, 30;

What is the reason for this? I summed up: in the case of the name of the function parameter and the local variable, if the local variable is only declared, but there is no assignment, the local variable will not overwrite the parameter. If the local variable is assigned a value, the parameter variable is overwritten down from the line where the value is assigned.

Is it clear how many of these discoveries have been made? In fact, JavaScript is easy to get started, but difficult to master. So let's encourage progress together. Finally, quote the JavaScript authoritative guide to summarize this article: "In thetopmost code of JavaScript (that is, code that is not included in any function definition), the scope chain consists of a global object. In the body without nested functions, there are two objects on the scope chain, the first is the object that defines the function arguments and local variables, and the second is the global object. When a function is defined, he actually saves a scope chain. When this function is called, he creates a new object to store his local variables, adds the object to the saved scope, and associates creates a new longer representation function with the scope ' chain '.

============= low-profile split line ==============

A study of the scope of JavaScript variables.