TDZ（temporal dead zone）暂时性死区

来源：

  • ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。
  • 只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。
  • ES6 规定暂时性死区和let、const语句不出现变量提升，主要是为了减少运行时错误，防止在变量声明前就使用这个变量，从而导致意料之外的行为。

暂时性死区的定义：

  • 在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称 TDZ）。

暂时性死区的本质：

  • 只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，只有等到声明变量的那一行代码出现，才可以获取和使用该变量。

举例说明

var a = 10;
function b() {
    console.log(a);
    let a = 20;
}
b();  // 报错
console.log(a);
  • 这里会报错，因为函数b中有let对a进行一个定义，前面的​​console.log(a);​​会出现暂时性死区，所以报错。
let a = 10;
function b() {
    console.log(a);
    var a = 20;
}
b(); // undefined
console.log(a); // 10
  • 因为这里的var会出现一个变量提升，所以这里只是没有定义，显示undefined。
let a = 10;
function b() {
    console.log(a);
    a = 20;
}
b(); // 10
console.log(a); // 20
  • 这里存在一个作用域链的问题，在函数的作用域里面找不到a的声明的时候就会到外面去找，因为函数内部没有使用let使其成为一个封闭的作用域。

注意：

typeof x; // 报错：ReferenceError
let x;
  • 上面代码中，变量x使用let命令声明，所以在声明之前，都属于x的“死区”，只要用到该变量就会报错。因此，typeof运行时就会抛出一个ReferenceError。但实际上，如果一个变量根本没有被声明，使用typeof反而不会报错。而是显示undefined。
  • 所以“暂时性死区”也意味着typeof不再是一个百分之百安全的操作。