JavaScript 函数作用域详解 🧠

函数作用域是JavaScript中变量查找的底层规则，理解它对编写可维护代码至关重要。以下是核心知识点：

1. 变量作用域规则

• 函数内部声明：使用var声明的变量属于函数作用域，仅在函数内部可访问

  function example() {
    var x = 10; // 仅在此函数内有效
    console.log(x); // 10
  }
  console.log(x); // 报错：x未定义
  

• 嵌套作用域：内部函数可以访问外部函数的变量

  function outer() {
    var y = 20;
    function inner() {
      console.log(y); // 20（访问外部作用域）
    }
    inner();
  }
  outer();
  

• 全局作用域：未用var声明的变量会成为全局变量

  var z = 30; // 全局作用域
  function test() {
    console.log(z); // 30（可访问全局变量）
  }
  test();
  

2. 块级作用域对比

• ES6新增：使用let/const声明的变量具有块级作用域

  if (true) {
    let a = 40; // 仅在if块内有效
    const b = 50; // 同上
  }
  console.log(a); // 报错：a未定义
  

• 与function作用域区别：块级作用域更小，能减少变量冲突
  
  

  javascript_variable

3. 实际应用建议

• 避免污染全局命名空间：使用let/const代替var
• 理解闭包原理：函数作用域与外部函数的关联性
  点击查看闭包详解

4. 常见误区

• 变量提升：var声明的变量会被提升到函数顶部

  function test() {
    console.log(x); // undefined（变量提升）
    var x = 10;
  }
  test();
  

• 作用域链：查找变量时会向上层作用域逐级搜索
  
  

  function_scope_chain

📌 提示：函数作用域是JavaScript的默认作用域机制，而块级作用域需要通过ES6语法实现。理解两者的差异能帮助你避免许多调试难题！