Analysis notes on let (const) temporary dead zone in JS

let Temporary dead zone of

const And let In this place, the principle is almost , Therefore, in order to let Take an example for analysis

1. What is a temporary dead zone

Let's start with a piece of code

console.log(a); // undefined
var a = 123;

If you know Variable Promotion , Then it's easy to know ,var This code for declaring variables is equivalent to

var a
console.log(tmp); // undefined
a = 123;

But the same code uses let When a variable is declared Report errors

console.log(a); // ReferenceError: Cannot access 'a' before initialization
let a = 123;

This is because of the neglect of let Of Temporary dead zone （ In the above code console.log(a) Medium a Is in a temporary dead zone ）

ES6 Regulations ,let/const The command makes the block form a closed scope . If you use variables before declaration , You're going to report a mistake .
All in all , In code block , Use let Before a command declares a variable , This variable is not available .
This is in grammar , be called “ Temporary dead zone ”（ temporal dead zone, abbreviation TDZ）

What people often remember is let The declared variables must be used after declaration That's why

2. In a temporary dead zone ‘ Range ’

ES5 Only global scope and function scope , There is no block-level scope , This brings a lot of unreasonable scenes .
ES6 in let It's actually JavaScript Added Block level scope .

Let's look at the following 2 Segment code , understand let/const The command makes the block form a closed scope

var a = 123;

if (true) {
    
  console.log(a); // 123
}

var a = 123;

if (true) {
    
  console.log(a); // ReferenceError: Cannot access 'a' before initialization3
  let a
}

In the 2 In this code , Used let,let/const The command makes the block form a closed scope , namely

if (true) {
    
 // let The closed scope of the command line 
}

Therefore, in if outside , use var Declared variables , Will be let Scope takeover of .
So where in this scope is Temporary dead zone Well , It's very simple , In this scope let Before declaring a variable , Are the temporary dead zones of this variable .

var a = 123;

if (true) {
    
  //  Variable a The temporary dead zone begins 
  console.log(a); // ReferenceError: Cannot access 'a' before initialization
  let a; 
  //  Variable a The temporary dead zone begins 
  console.log(a); // undefined
  a = 123;
  console.log(a); // 123
}

3. The impact of a temporary dead zone （ Use let What to pay attention to when ）

1. let The declared variable must be in Use... After declaration , Otherwise, the report will be wrong
2. let Not allowed in the same scope , Repeatedly declare the same variable
3. typeof It's no longer a 100% safe operation

On the third point , See the following code

typeof a // ReferenceError: Cannot access 'a' before initialization
let a