Scope is variable / The area in which the function can be accessed .

Global scope

{} And the area outside the function is the global scope .

• The declared variables in the global scope are global variables , It can be accessed in any part of the page .
• Variables of function scope cannot be accessed in global scope
• The global scope is created when the page opens , Destroy when the page is closed .
• There is a global object in the global scope window, It represents a browser window , Created by browser , You can use it directly , The global variable is window Object properties , The function is window Object method .

function foo() {
    
    var a = b = 100; //  Continuous assignment 
}

foo();

console.log(window.b); //  Print  100 
console.log(window.a); //  Print  undefined 
console.log(a); //  Report errors  Uncaught ReferenceError: a is not defined

var a = b = 100 This line of consecutive assignment code is equivalent to var a = (b = 100), The order of execution is ：

1. The first 100 Assign a value to b;
2. And then declare variables a
3. And then b The value of is assigned to a

• b An undeclared variable is assigned a value , Belong to window.b;
• a The scope of is limited to foo() Internal function , Do not belong to window;

Block scope

{} Block scope in

• Variables are only valid in code blocks ;

ES5 Itself does not provide block level scope , We usually use an immediate call function expression to implement

(function () {
    
  var block_scoped=0;
}());
console.log(block_scoped); // Misquote 

ES6 in , Use let and const Implement block level scope

let a =1
if(a===1) {
    
  let b = 2
}
console.log(b); // Uncaught ReferenceError: b is not defined

Function scope

The area within the function is the function scope （ namely function in { } The inner part of ）

The principle of function scope

Execution context ： When the function executes , An internal object of the execution time context will be created . Every time a function is called , A new context object will be created , They are independent of each other . When the function is finished executing , The execution context it generates is destroyed .

When operating on a variable in the scope of a function , It will first look for , If there is, use it directly （ Nearby principle ）. If not, look up to the next level of scope for , Until the global scope is found ; If the global scope is still missing , May be an error ReferenceError.

Characteristics of function scope

• Variables in the function scope that can access the global scope , Such as window.a（ Both the global scope and the function scope define variables a when ）
• The global scope cannot access variables defined within a function
• Function , Use var Keyword declared variables , Will be declared before all code in the function executes
• Function , No, var Declared variables are global variables , And it doesn't say in advance .
• Function , Function declarations are also executed before all code in the function is executed

    var a = 1;

    function foo() {
    
        console.log(a);
        a = 2;     //  Here a amount to window.a
    }

    foo(); //  The printout is 1
    console.log(a);   // The printout is 2

Defining a parameter is equivalent to declaring a variable in the scope of a function .

    function fun6(e) {
     //  In this function , Because of the formal parameters  e, This is equivalent to the first line of code inside the function , Yes  var e;
        console.log(e);
    }

    fun6();  // The result is  undefined
    fun6(123);// The result is 123