The similarities and differences of variable declarations and scopes between ES5 and ES6

Before es6 out, JS Scope has only two top-level scopes and function scopes, but the appearance of ES6, let JS variable scope has a new existence form: block-level scope .

Before you know the block-level scope, you have to review the variable declarations and scopes of the ES5 . Variable declaration:

We all know that JS uses the VAR keyword to declare a variable, and if you don't use the VAR keyword to declare a variable, the declared variable is the top-level variable (although this is not a rigorous notation, it throws an exception in the strict mode of ES5). When we declare a variable directly, it is equivalent to mount a new variable under window. For example:

A = 1;
WINDOW.A = 1;
The above two kinds of writing are the same. But the first one is wrong in the following cases.

' use strict '
a = 1;//uncaught referenceerror:a are not defined (...)

variable elevation:

In JS, all variables declared by VAR are promoted to the top of the scope to declare, and then assigned at the point of declaration. Just look at the code.

var a = 1;
function foo () {
    console.log (a);  undefined;
    The variable declaration is promoted to the top of the scope of the current function, because a variable is declared again within the function, although a variable is only after the current statement.
    //Note that this is only promoted to the top of the statement, without assignment, the assignment or the declaration of the variable row, all the following console.log will print out 3.
    var a = 3;
    Console.log (a);  3
}
foo ();

One thing to note is that Var declares a function variable, and the effect is not the same as using function-defined functions directly. var can only advance the declaration of a variable name, while using function to define a function, the initialization of functions is also advanced, so no matter when you use function declaration functions, as long as there is a declaration call will not produce errors, and var form of the function expression, A function cannot be found until it is assigned a value.

Fun (); Uncaught Typeerror:fun is not a function (...)
var fun = function () {
    alert (1);
}

-----------

Fun ();//1
function Fun () {
    alert (1);
}

One more thing is to reuse two functions of the same function name, and then the declaration takes effect

function Fun () {return
    1;
}

Console.log (Fun ());  2

function Fun () {return
    2;
}

ES6 How to declare a variable:

ES6 introduces two new ways of declaring variables: let and const. Let
Variables that use let declarations are similar to variables declared by Var, and the only difference is that they can only be useful in the current block-level scope. First look at what is a block-level scope, the so-called block-level scope, is the current code block, in simple terms is a pair of curly braces in the content is called block-level scope, such as the content of an if statement, a for loop content.

{
    var  a = 1;
    Let B = 2;
}

Console.log (a); 1
console.log (b);//b is not defined (...)

Look at one more example:

if (true) {let
    a = 1;
}

Console.log (a); A is not defined (...)

The introduction of block-level scopes has many advantages, such as solving the problem of global pollution caused by variables defined in the For loop, and no need to use closures to save the necessary variables, because the variables of each code block are independent of each other and do not cause global variables to be contaminated.

ES5: For
(var i=0;i<5;i++) {

}
console.log (i),//5


//es6: For
(let i=0;i<5;i++) {

}
Console.log (i);//i is not defined (...)

ES5:
var arr = [] for
(var i=0;i<5;i++) {
    Arr[i] = function () {
        alert (i);
    }
}
ARR[3] (); 5


//es6: let
arr = [] for
(let i=0;i<5;i++) {
    Arr[i] = function () {
        alert (i)}
}
Arr[3] ()//3

Const
Variables declared with the const are similar to let-declared variables and can only be useful in block-level scopes, except that the const-declared variable is read-only, meaning that the declaration cannot be modified after that.

Const PI = 3.1415;
PI = 3; Assignment to constant variable.

Let and const do not have variable elevation:

Variables that were previously seen in the Var declaration will be elevated, but the variables declared with let and const do not have this feature.

{
    Console.log (a);//a is not defined (...)
    let a = 1;

    -------

    Console.log (b);//b is not defined (...)
    Const B = 1;
}

If you call the variable before you declare it, an error (REFERENCEERROR) is generated. We called the A variable before let a in the case above, but the variable is not available, and we call the area of the variable not available as "temporary Dead zone" (temporal dead zone, referred to as TDZ). It's also good to be able to use the variable without declaring it so that you can reduce some code-run errors, like ES5 if you're using it, it's hard to see where it went wrong. duplicate variable declarations are not allowed:

{Let
    a = 1;
    Let A = 2; Identifier ' A ' has already been declared
}

Repeating a variable in the same block-level scope with a syntax error.

ES6 for JS variables provides two new variable declaration modes (Let and const), and provides a new block-level scope. Although this gives JS flexibility before a certain limit, but this is nothing, too flexible will cause a lot of confusion, the introduction of block-level scope so that we do not have to use the closure of the way to save some variables.