JavaScript中的范围（Scope）

在JavaScript中，范围是一种定义变量可访问性的机制。范围定义了JavaScript中变量的生命周期，也就是变量何时被创建、修改和销毁。

JavaScript中的范围类型

JavaScript中有两种类型的范围：全局范围和局部范围。

全局范围

全局范围始终存在，它定义了全局变量。在任何地方，只要没有被定义在函数内部，就可以访问这些变量。

// 全局变量
var globalVar = 1;

function exampleFunction() {
  // 访问全局变量
  console.log(globalVar);
}

局部范围

局部范围是在函数内部定义的范围，它定义了局部变量。局部变量只能在定义它的函数内部访问。

function exampleFunction() {
  // 局部变量
  var localVar = 2;
  
  // 访问局部变量
  console.log(localVar);
}

JavaScript中的变量查找

当使用变量时，JavaScript会在范围链中查找该变量。范围链就是由当前作用域和所有父级作用域组成的列表。当JavaScript查找变量时，会从当前作用域开始，一直向上查找直到找到该变量或到达全局作用域为止。如果变量在所有范围中都无法找到，则会抛出ReferenceError错误。

var globalVar = 'global';

function outerFunction() {
  var outerVar = 'outer';
  
  function innerFunction() {
    var innerVar = 'inner';
    
    // 从当前作用域向上查找变量
    console.log(innerVar); // inner
    console.log(outerVar); // outer
    console.log(globalVar); // global    
  }
  
  innerFunction();
}

JavaScript中的词法范围（Lexical Scope）

JavaScript使用词法范围（也称为静态范围）定义变量可访问性。词法范围是在编写代码时确定的，它由代码中嵌套的作用域组成。在词法范围中，变量在定义它们的位置可见，而不是在运行时。

var globalVar = 'global';

function outerFunction() {
  var outerVar = 'outer';
  
  function innerFunction() {
    var innerVar = 'inner';
    
    // 从词法作用域中查找变量
    console.log(innerVar); // inner
    console.log(outerVar); // outer
    console.log(globalVar); // global    
  }
  
  innerFunction();
}

outerFunction();

在上面的例子中，innerFunction的词法范围包括innerVar、outerVar和globalVar。innerVar的词法范围只是innerFunction，outerVar的词法范围是innerFunction和outerFunction，globalVar的词法范围是整个JavaScript文件。

结论

JavaScript中的范围是一种非常重要的机制，它定义了变量的生命周期和可访问性。理解范围可以帮助我们编写更健壮、可读性更好的JavaScript代码。