How to use the new let command in ES6

Keywords: Javascript

let command usage

let is a command to declare a variable in es6. It is only valid in the code block it declares. If the code block is out, an error will be reported. It is also very suitable for the for loop. In the loop, the value of i only takes effect in the loop statement and cannot be retrieved outside.

The var command declares a global variable, i is a variable pointing to the global, and only outputs the final value. let only takes effect in the loop statement block, and each loop will redeclare an i, so each loop can get the corresponding value.

The variable of the for loop is the parent scope, which is not in the same scope as the variable (child scope) defined by let in the loop body.

For example:

//1. Valid in its own code block
{
    let a = 1;
    var b = 2;
}
console.log(b); // 2
console.log(a); // a is not defined

//2. Valid in for loop statement block
for(var i=0;i<10;i++) {
    //...
}
console.log(i); // 10
for(let j=0;j<10;j++) {
    //...
}
console.log(j); // j is not defined

var arr = [];
for(var a=0;a<10;a++) {
    arr[a] = function () {
        console.log(a);
    }
}
console.log(a[4]); // 10
for(let b=0;b<10;b++) {
    arr[b] = function () {
        console.log(b);
    }
}
console.log(b[4]); // 4


// 3.for loop variables and variables in the loop body
for(var i=0;i<10;i++) {
    let i = 'fed';
    console.log(i);
}
/*
* The result is
*   fed
*   fed
*   fed
*/

let command does not have scope elevation

The var command will have scope promotion. Before declaration, it is undefined. If it is not declared, it has a default value. The variables defined by let must be used after declaration.

console.log(fa); // undefined
var fa = 1;
console.log(fb); // fb is not defined
let fb = 2;

let has temporary deadband

"Temporary dead zone" (TDZ) refers to the closed scope of variables declared by let and const commands in ES6 if there are such commands in the block. Variables declared before this will report errors.

For example: a global variable is declared below, but a let declares another variable in the block level scope.

var food = 'apple';
if(typeof 'str' == 'string') {
    food = 'banana'; // Uncaught ReferenceError: food is not defined
    let food;
    console.log(food); // undefined
    food = 'orange';
    console.log(food); // orange
}

Note: for the time being, there will be some disadvantages in the fourth district.

Unsafe type of detection

typeof x; // Uncaught ReferenceError: x is not defined
let x;

Duplicate declaration not allowed

In short, it is not allowed to declare two identical variables in the same scope.

For example:

{
    let a = 1;
    var a = 2; // Uncaught SyntaxError: Identifier 'a' has already been declared
}
// perhaps
{
    let b = 1;
    let b = 2; // Uncaught SyntaxError: Identifier 'b' has already been declared
}

Note: parameters cannot be declared repeatedly in function parameters, otherwise an error will be reported.

function wait(x,y) {
    let x = 1; // Uncaught SyntaxError: Identifier 'x' has already been declared
    let y = 2; // Uncaught SyntaxError: Identifier 'y' has already been declared
}
wait(3,5);

Written in the end

The above are some instructions on how to use let commands correctly, which can be used in practice.

Posted by ganesh on Tue, 03 Dec 2019 03:11:41 -0800