在 ES6（或称 ECMAScript 2015）中，引入了 let 和 const 两个新的声明变量的关键字。相比于 var，它们有更明确的作用域和更严格的限制，使得代码更易于维护和理解。而在 let 和 const 中，还存在一个重要且易错的概念——暂时性死区，本文将详细介绍它的概念和应用。
暂时性死区的定义
在 let 或 const 声明的变量从代码流中被创建到变量被声明并准备好使用为止的这段时间里，被称之为暂时性死区（Temporal Dead Zone, TDZ）。在这个阶段使用该变量会抛出 ReferenceError 异常。这一特性是为了保证在声明之前就使用变量会受到语法错误的限制，从而在代码运行时更加健壮和可读。
看下面的代码片段：
console.log(a); // undefined var a = 1;
该代码片段在控制台打印出 undefined，是因为在 console.log 函数执行时 a 变量被创建，虽然其尚未被赋值，但是 JavaScript 引擎会将 a 的值默认为 undefined。而在以下代码片段中：
console.log(a); // ReferenceError let a = 1;
控制台会抛出 ReferenceError 异常，因为在 console.log 函数执行时 a 变量依然在暂时性死区中，还未声明并准备好使用。
暂时性死区的应用
暂时性死区的存在旨在使代码更加健壮和可读，但在实际开发中，却经常会因为遗漏而产生错误。正确地使用暂时性死区，有助于减少代码错误和调试时间。
循环中的 let
在常见的循环场景中，使用 var 声明的变量可能会导致意想不到的后果。如下的代码：
for (var i = 0; i < 3; i++) {
setTimeout(function() {
console.log(i);
}, 100);
}虽然期望输出的结果是 0, 1, 2 三个数字，但实际上输出的却都是 3。这是因为 setTimeout 函数的回调被异步调用，当回调函数被调用时，i 的值已经变成了 3。而如果使用 let 声明，就可以在每次循环中都创建一个新的 i 变量，避免出现错误。
for (let i = 0; i < 3; i++) {
setTimeout(function() {
console.log(i);
}, 100);
}这次输出结果就是正确的 0, 1, 2 了。
条件语句的 let
let 声明变量的作用域只在当前块级作用域内有效。这和 var 声明变量的全局或函数作用域不同。因此在条件语句中使用 let 声明变量，可以避免变量作用域泄露。
if (condition) {
let score = 80;
console.log(score); // 80
}
console.log(score); // ReferenceError: score is not defined这种方式既避免了变量作用域污染，又提高了代码的可读性和可维护性。
总结
暂时性死区是 let 和 const 的一个重要特性，使得代码更加健壮和可读。在开发中正确使用暂时性死区可以避免代码错误和作用域泄露的情况。同时，在循环和条件语句中使用 let 可以解决常见的 JavaScript 问题。建议开发者掌握这一特性，并在实际开发中灵活应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e7b386f6b2d6eab3338141