📌 作用域基础概念

作用域决定了变量在代码中的可访问范围，JavaScript中主要有两种作用域：

  • 全局作用域（global scope）：在函数外部声明的变量
  • 局部作用域（local scope）：在函数内部声明的变量

💡 关键特性：

  • 变量声明提升（Hoisting）
  • 作用域嵌套
  • 避免变量污染

📄 词法作用域（Lexical Scoping）

JavaScript采用词法作用域，变量查找遵循以下规则：

  1. 在当前作用域中查找
  2. 未找到则向上级作用域查找
  3. 最终到达全局作用域
function outer() {
  let x = 10;
  function inner() {
    console.log(x); // 10
  }
  inner();
}
outer();
function_scoping

🔍 作用域链（Scope Chain）

当访问变量时，JavaScript会沿着作用域链逐层向上查找：

  1. 当前函数作用域
  2. 外部函数作用域
  3. 全局作用域

📦 块级作用域（Block Scope）： ES6引入let和const后，代码结构更清晰：

if (true) {
  let y = 20;
  const z = 30;
  console.log(y, z); // 20 30
}
console.log(y); // 报错：y未定义
block_scoping

❓ 常见问题与最佳实践

  1. 变量提升：var声明的变量会提升到顶部
  2. 闭包：函数可以访问其外部作用域的变量
  3. 模块化开发：建议使用ES6模块（import/export）

🔗 扩展学习：了解更多关于ES6模块化的内容，请访问 /tutorials/js_modules

scope_chain_diagram