JavaScript learning talk about the global variables and local variables of JS (recommended) _javascript tips

Today, the company an internship little sister asked me two pieces of JS code difference:

Code One:

<script type= "Text/javascript" >
 var a = "Hello";
 function test () {
   var A;
   alert (a);
   A = "World";
   alert (a);
 }
</script>

Code two:

<script type= "Text/javascript" >
 var a = "Hello";
 function test () {
   alert (a);
   A = "World";
   alert (a);
 }
</script>

I think, so simple, is not the global variable and local variable scope problem? I said: "When a global variable has the same name as a local variable, the scope of the local variable overrides the scope of the global variable, and when it leaves the scope of the local variable, it returns to the scope of the global variable." So the results of two code runs were: 1 undefined World 2) Hello world. I then randomly made up the following example for her:

<script>
  var a =1;
  function test () {
    alert (a);
    var a = 2;
    alert (a);
  }
  Test ();
  alert (a);
 </script>

Guess how much the result equals? is the output 1 2 1? Well, I thought so before I sent the test case to her, but after testing the output ... The results of the operation are undefined 2 1. At that time baffled, asked the valley teacher just know, I am not very understanding of JS, so painstaking effort, learning + testing, summed up as follows:

The scope of a JavaScript variable is divided according to the method block (that is, a pair of curly braces {} of the function). Remember that it is a function block, and for, while, if block is not a scoping criterion, you can look at the following examples:

<script>
function Test2 () {
  alert ("before for Scope:" +i);  I was not assigned a value (not declared!) Use undeclared variables or functions to throw fatal errors and break script execution)

                          //At this point the value of I is underfined for
  (var i=0;i<3;i++) {
    alert ("In for Scope:" +i); The value of I is 0, 1, 2, when I jump out of circulation at 3 o'clock
  }
  alert ("After for scope:" +i); The value of I is 3, note that it is already outside of for scope, but the value of I remains at 3 while
  
  (true) {
    var j = 1;
    break;
  Alert (j);  The value of J is 1, note that it is already outside of the while scope, but the value of J remains at 1

  if (true) {
    var k = 1;
  }
  Alert (k); The value of K is 1, note that it is now outside the if scope, but the value of K is still retained at 1
}

test2 ();
What happens to the I, J, k variables that only exist in test2 this function scope at this time (outside of the function scope)?
alert (i);//error! Yes, it is error, because the variable I did not declare (not unassigned, distinguish the first line of the Test2 function output), causing the script error, the program to end!
alert ("Does this line of printing still output?") ");
alert (j) not executed;//not executed
alert (k);//not executed
</script>

Second, JavaScript in the implementation of the entire script file in the declaration part of the complete analysis (including local variables), so as to determine the scope of real variables. How do you understand it? Look at one of the following examples:

<script>
  var a =1;
  function test () {
    alert (a);//a is undefined! this is not a global variable, because a local variable with the same name (the 4th line of the function body) has been declared within function scope.
           So global variable A is overwritten, which means that JavaScript performs a complete analysis of the definition part of the entire script file before it executes, so before the function test () executes, the
           variable A in//function body is pointed to the internal local variable. Instead of pointing to external global variables. But then a is only declared, not yet assigned, so output undefined.
    a=4    
    Alert (a);//a is 4, no suspense? Here's a or a local variable Oh!
    var A;   The local variable a declares
    alert (a) in this line,//a or 4, because the 4 was previously assigned to a and
  test ();
  alert (a); A is 1, this is not within the function scope, and the value of a is the value of the global variable
</script>

Third, when the global variable with the name of the local variable, the scope of local variables will cover the scope of global variables, when leaving the scope of local variables, and then return to the scope of global variables, and when the global variable when the local variables, how to use global variables? With Window.globalvariablename.

<script>
  var a =1;
  function test () {  
    alert (WINDOW.A);//a is 1, where a is a global variable Oh!
    var a=2;   Local variable a defines
    alert (a) in this line;//a is 2, where a is a local variable Oh!
  }
  Test ();
  alert (a); A is 1, this is not within the function scope, and the value of a is the value of the global variable
</script>

Of course, more articles can refer to the following related articles.