变量提升需注意作用域和声明方式

对于一个文章开发者来说，牢固扎实的基础是十分重要的，golang学习网就来带大家一点点的掌握基础知识点。今天本篇文章带大家了解《变量提升要注意什么？》，主要介绍了，希望对大家的知识积累有所帮助，快点收藏起来吧，否则需要时就找不到了！

var声明变量名提升但赋值不提升，let/const仅声明提升且存在暂时性死区（TDZ），函数声明完全提升而函数表达式仅变量名提升；三者语义不同，需依声明方式判断访问行为。

var 声明的变量会被提升到作用域顶部

JavaScript 引擎在执行代码前会先进行“预解析”，var 声明的变量名会被提升（hoist）到当前函数或全局作用域顶部，但赋值不会。这意味着你可以先 console.log(x) 再 var x = 1，不会报错，但输出是 undefined。

常见错误现象：

• 误以为声明和赋值一起被提升，导致逻辑判断出错（比如 if (x === undefined) 意外成立）
• 在函数内重复用 var 声明同名变量，实际只创建一次，后声明被忽略

console.log(a); // undefined
var a = 2;
console.log(a); // 2

let 和 const 不会提升变量初始化，但有暂时性死区（TDZ）

let 和 const 声明的变量名也会被提升，但引擎不会初始化它们——从块级作用域开始到声明语句之前，访问该变量会直接抛出 ReferenceError，这就是“暂时性死区”。

使用场景：

• 避免在声明前意外读取未定义值（var 下静默返回 undefined）
• 强制代码顺序清晰，尤其在闭包、循环中绑定正确值时更安全

console.log(b); // ReferenceError: Cannot access 'b' before initialization
let b = 3;

函数声明和函数表达式提升行为不同

函数声明（function foo() {}）会被完全提升：函数名和函数体都可用；而函数表达式（var foo = function() {}）只提升变量名，不提升赋值，行为等同于 var 声明。

容易踩的坑：

• 在条件分支里写函数声明（如 if (...) function f() {}），行为在不同引擎中不一致，ES 规范不鼓励这种写法
• 用 let/const 定义函数表达式时，同样受 TDZ 限制，不能提前调用

foo(); // OK，函数声明被完全提升
function foo() {}

bar(); // TypeError: bar is not a function
var bar = function() {};

提升只发生在声明所在的作用域内，不影响嵌套或块级作用域边界

变量提升不会跨函数、也不会穿透 {} 块（除非是 var，它本就不受块级作用域限制）。let/const 的提升范围严格限定在最近的块级作用域内，且受 TDZ 约束。

性能与兼容性影响：

• 现代引擎对提升的优化已非常成熟，不必担心性能损耗
• IE10 及更早版本对 let/const 完全不支持，若需兼容，必须用 Babel 转译或改用 var + 显式作用域控制
• 箭头函数没有自己的 this，但它本身是函数表达式，不被提升

if (false) {
  var x = 1; // 仍会提升到函数/全局顶部
}
console.log(x); // undefined（非报错）

{
  let y = 2;
  console.log(y); // 2
}
console.log(y); // ReferenceError: y is not defined

真正麻烦的不是“有没有提升”，而是你是否清楚当前变量是用 var、let 还是 const 声明的——三者提升的语义完全不同，且错误表现方式差异很大。调试时看到 undefined 或 ReferenceError，第一反应不该是“怎么又错了”，而是立刻检查声明方式和访问位置。

今天关于《变量提升需注意作用域和声明方式》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！