JavaScript变量存储异常求助：if语句作用域离开后变量丢失

嘿，这绝对是JavaScript新手刚接触作用域时最常遇到的问题之一，别慌，其实本质就是变量作用域范围的事儿，很容易修复！

先搞懂问题根源 #

你大概率是在if的代码块里用了let或者const声明变量——这俩是ES6新增的块级作用域变量，意思是它们只在包裹它们的{}内部有效，一旦跳出这个代码块，外部就找不到它们了。举个典型的错误例子：

if (someCondition) {
  let userData = "从接口拿到的数据";
  // 这里能正常用userData
}
// 这里想访问userData就会报错：userData is not defined
console.log(userData);

而如果是用了老的var，你可能不会报错，但这反而更危险——因为var是函数级作用域，它会无视if这样的块级范围，直接提升到函数顶部（如果在全局就是全局作用域），但这种行为很容易导致变量污染，所以现在几乎没人推荐用var了。

简单有效的修复方案 #

要让变量能在if外面被访问到，只需要把变量的声明语句移到if块的外面，在块内只做赋值操作就行：

// 先在if外部声明变量（用let/const，根据是否需要重新赋值选择）
let userData;
if (someCondition) {
  // 这里只赋值，不重新声明
  userData = "从接口拿到的数据";
}
// 现在就能正常访问啦
console.log(userData);

如果变量可能一开始没有值，也可以给个默认值，比如let userData = null;，避免后续出现undefined的情况。

额外提醒 #

• 尽量坚持用let和const：它们的块级作用域能帮你避免很多莫名其妙的bug，代码逻辑也更清晰。
• 如果你的变量在if里一定会被赋值，也可以用三元表达式简化，但前提是逻辑不复杂：

  const userData = someCondition ? "拿到的数据" : "默认值";
  

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