JavaScript变量作用域问题：运行代码报x未定义错误求助

嘿，别着急，这个报错其实是JavaScript里**暂时性死区（TDZ）**的典型情况，刚接触编程很容易踩这个坑，我给你一步步讲明白～

首先先把你的代码贴出来方便分析：

var x = true; 
if (x == true) { 
  console.log(typeof(x)); 
  let x = false; 
}; 
console.log(x);

问题出在哪？ #

1. 你先用var x声明了一个全局/函数级作用域的变量x，赋值为true。
2. 进入if块后，你写了let x = false——这会在这个if的块级作用域里创建一个全新的x变量。
3. 关键来了：let声明的变量会被提升到块的顶部，但在你执行let x = false这行之前，这个新的x处于「暂时性死区」，根本不能被访问。
4. 当你执行console.log(typeof(x))时，JS会优先在当前的块级作用域里找x，它找到了那个处于TDZ的let x，而不是外面的var x，这时候访问它就会抛出Error: x is not defined的错误。

怎么修复？ #

给你两种常见的解决方案：

方案1：修改块内变量名，避免重名 #

如果块内的变量不需要和外部的x关联，直接换个名字就行：

var x = true; 
if (x == true) { 
  console.log(typeof(x)); // 这里访问的是外部的var x，输出"boolean"
  let y = false; // 把x改成y
}; 
console.log(x); // 输出true

方案2：直接赋值，不用重新声明 #

如果你本来就是想修改外部的x，那去掉let直接赋值就好，因为var x已经在外部声明过了：

var x = true; 
if (x == true) { 
  console.log(typeof(x)); // 输出"boolean"
  x = false; // 直接修改外部的x，不用let重新声明
}; 
console.log(x); // 输出false

额外知识点：var vs let的作用域差异 #

• var是函数级/全局作用域，没有暂时性死区，声明会被提升并初始化为undefined。
• let是块级作用域，存在暂时性死区，在声明语句之前访问会报错。

以后写代码的时候，尽量多用let和const，它们的块级作用域能避免很多奇怪的作用域问题哦～

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