JavaScript 中的 var 声明具有函数作用域而非块作用域

本文详解 `var` 变量为何能在 `if/else` 块内声明后被父函数直接访问，而无法在嵌套函数中同理使用，并对比 `let`/`const` 的块级作用域行为，帮助开发者彻底理解 javascript 作用域机制。

在 JavaScript 中，变量的作用域规则是理解代码行为的关键。一个常见误区是认为 if 或 else 语句会创建独立的作用域——实际上，if、else、for、while 等语句块本身不构成作用域边界；只有函数（function） 和 模块（module）（以及 ES6 引入的 let/const 块级作用域）才定义新的作用域。

✅ var 是函数作用域（Function-scoped）

使用 var 声明的变量会被“提升”（hoisted）到其所在函数的顶部，且在整个函数体内均可见，无论它实际出现在哪个代码块中。因此：

function test() {
  var a = 2;
  if (a) {
    var b = 3; // 被提升至 test 函数顶部，等价于：var b; → b = 3;
  }
  console.log(b); // ✅ 输出 3 —— b 在整个 test 函数内有效
}
test();

上述代码等效于：

function test() {
  var a = 2;
  var b; // 提升发生，但尚未赋值
  if (a) {
    b = 3; // 赋值
  }
  console.log(b); // 3
}

❌ 嵌套函数拥有独立作用域

而当 b 在内部函数 test_2 中用 var 声明时，它属于 test_2 的函数作用域，对外部函数 test 不可见：

立即学习“Java免费学习笔记（深入）”；

HaiSnap

一站式AI应用开发和部署工具

下载

function test() {
  function test_2() {
    var b = 3; // 仅在 test_2 内部有效
  }
  test_2();
  console.log(b); // ❌ ReferenceError: b is not defined
}
test();

这是因为每个函数都创建自己的词法环境（Lexical Environment），var b 的作用域被严格限制在 test_2 内部。

? 对比 let 和 const：真正的块级作用域

ES6 引入的 let 和 const 遵循块级作用域（Block-scoped），即 {} 包裹的任意语句块（包括 if、for、{} 直接块）都会形成作用域边界：

function demo() {
  if (true) {
    let blockLet = 'inside';
    const blockConst = 'also inside';
    var functionVar = 'function-scoped';
  }

  console.log(functionVar);     // ✅ 'function-scoped'
  console.log(blockLet);       // ❌ ReferenceError
  console.log(blockConst);     // ❌ ReferenceError
}
demo();

? 小贴士：var 的函数作用域 + 变量提升特性容易引发意料之外的行为（如循环中闭包问题）。现代开发中，优先使用 const，仅在需重新赋值时用 let，可显著提升代码可预测性与可维护性。

✅ 总结

理解这一根本差异，是写出健壮、可调试 JavaScript 代码的基础。避免依赖 var 的函数作用域“穿透”行为，转而用清晰的块级作用域表达逻辑意图。