let/const变量提升、TDZ机制及前置访问报错原因疑问

先纠正一个普遍认知误区 #

很多人从var的表现倒推，把“变量提升”等同于“声明语句被提前到作用域顶部、声明前访问能拿到undefined”，这是错的。
变量提升的本质是JS引擎的词法分析机制：代码逐行执行前，引擎会先扫描当前作用域内的所有声明，把这些声明的变量/函数提前绑定到当前作用域的词法环境中，整个作用域范围内都能感知到这些标识符的存在，不会默认把它们当成跨作用域的全局变量处理。
var声明的特殊点只是：提升的同时会被提前初始化为undefined，所以声明前访问不会报错，这是var独有的行为，不是变量提升的判定标准。

按照MDN的官方定义：与var声明不同，let和const声明的变量虽然会被提升，但不会被初始化为默认值，若在初始化完成前读取这类变量，会抛出ReferenceError异常。

示例代码报错的核心原因 #

先看存在疑问的代码段：

x = 9
console.log(x) // 为什么这里会抛未初始化的ReferenceError？
let x;

执行逻辑拆解：

1. 代码执行前的扫描阶段，最后一行的let x已经被提升，当前作用域明确登记了x这个let声明的标识符，引擎不会把第一行的x=9识别为“给全局对象挂载x属性”的隐式全局变量操作。
2. let/const声明的变量，从作用域起始位置开始，到代码逐行执行到变量声明语句之前，这段区间就是该变量的暂时性死区（TDZ）。TDZ内的变量处于「已被作用域登记、但未完成初始化」的状态，任何读写操作都会直接触发ReferenceError。
3. 上述代码里第一行的x=9本身就处在x的TDZ范围内，赋值操作直接触发了TDZ访问限制，根本不会执行赋值逻辑，后续的console.log自然也无法正常执行。

TDZ和变量提升不是互斥关系，恰恰是共存的 #

很多人会疑惑“如果let有提升，为什么还要设计TDZ不让提前访问”，甚至反过来觉得“有TDZ就说明let没有提升”，这个逻辑站不住脚，可以做个简单的对照：
如果把示例最后一行的let x;删掉，第一行的x=9会被当成隐式全局变量，代码完全可以正常运行，打印出9——这才是“x没有在当前作用域提升、引擎感知不到x声明”的表现。
反过来，只要当前作用域内存在let x的声明，不管声明写在作用域的哪个位置，作用域起点到声明行之间的x都会被识别为当前作用域的let变量，受TDZ限制访问，这恰恰是let存在变量提升的最直接证据。

不同声明关键字的提升行为差异 #

• var：声明提升到作用域顶部，同步初始化为undefined，无TDZ，声明前访问返回undefined
• 函数声明（function fn(){}）：声明提升到作用域顶部，同步初始化为函数本身，无TDZ，声明前可直接调用
• let/const/class：声明提升到作用域顶部，不会提前初始化，作用域起点到声明行之间为TDZ，TDZ内访问直接抛错；其中const要求声明时必须同步完成赋值初始化

内容的提问来源于stack exchange，提问作者nzim