Using the let statement to declare scope in JavaScript (picture and text tutorial)

First of all, please note that let is a thing in ES6, at least it is compatible with IE browsers before IE10, so be careful! Well... Then let’s look at the usage of using let statement to declare scope in JavaScript

Syntax

let variable1 = value1

Parametersvariable1
The name of the variable to be declared.
value1
The initial value assigned to the variable.

RemarksUse the let statement to declare a variable whose scope is limited to the block in which it is declared. You can assign a value to a variable when you declare it, or you can assign a value to the variable later in the script.
Variables declared using let cannot be used before declaration, otherwise an error will occur.
If your variable is not initialized in a let statement, it will automatically be assigned the JavaScript value undefined.

Example:

var l = 10;
{
  let l = 2;
  // At this point, l = 2.
}
// At this point, l = 10.

// Additional ways to declare a variable using let.
let index;
let name = "Thomas Jefferson";
let answer = 42, counter, numpages = 10;
let myarray = new Array();

Block-level scope

for(var i = 0; i < 10; i++){}
console.log(i); //10

for(let j = 0; j < 10; j++){}
console.log(j); //"ReferenceError: j is not defined

No variable promotion

console.log(a); // 输出undefined
console.log(b); // 报错ReferenceError
console.log(c); // 报错ReferenceError
var a = 2;
let b = 2;

Note The difference between undefined and ReferenceError

Temporary Dead Zone (TDZ)As long as you enter the current block-level scope, the variables used already exist, but they belong to the dead zone before they are declared and cannot be processed operate.
Note: typeof is no longer a 100% safe operation

typeof x; // ReferenceError
typeof y // undefined
let x;

Duplicate declarations are not allowed

let x = 1;
let x; // "SyntaxError: Identifier 'x' has already been declared

var y = 2;
var y = 3; // y = 3

Block-level scope

// 匿名函数写法
(function () {
 var tmp = ...;
 ...
}());

// 块级作用域写法
{
 let tmp = ...;
 ...
}

The strict mode of ES5 stipulates that functions can only be declared in the top-level scope and within the function. Declarations in other situations (such as if code blocks and loop code blocks) will report an error.

// ES5
'use strict';
if (true) {
 function f() {} // 报错
}

Since ES6 introduces block-level scope, this situation can be understood as the function is declared in the block-level scope, so no error is reported, but the curly brackets that constitute the block cannot be missing

// 报错
'use strict';
if (true)
 function f() {}

The declared global variables are no longer attributes of the window

"use strict";
var a = 1;
console.log(window.a) // 1

let b = 1;
console.log(window.b) // undefined

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

In-depth understanding and practical combat of javascript Function (code attached)

##JavaScript Basic mental skills (picture and text tutorials, detailed answers for you)

Detailed answers to the JavaScript module

The above is the detailed content of Using the let statement to declare scope in JavaScript (picture and text tutorial). For more information, please follow other related articles on the PHP Chinese website!