JS进阶——作用域和作用域链

在JavaScript中，作用域（Scope）是一个非常重要的概念，它决定了变量、函数和对象的可访问性。理解作用域对于掌握JavaScript的高级特性至关重要。

作用域：

作用域是变量、函数和对象的可访问性范围。在JavaScript中，有两种主要类型的作用域：全局作用域和局部作用域（包括函数作用域和块级作用域）。

全局作用域：

在代码的任何地方都可以访问全局作用域中的变量。在浏览器环境中，全局作用域中的变量附加到window对象上。

const num = 10
function fn() {
    console.log(num)
}

局部作用域：

函数作用域：

在函数内部声明的变量只在该函数内部可见。

// 此处不能调用 carName 变量
function myFunction() {
    var carName = "Volvo";
    // 函数内可调用 carName 变量
}

块级作用域（ES6引入）：

使用let和const关键字声明的变量具有块级作用域。这意味着这些变量只在声明它们的块或任何包含块中可见。let和const还引入了词法作用域（也称为静态作用域），这意味着变量的作用域在代码编写时就已经确定，而不是在运行时。

在 ES6 中，提供了 let 关键字和 const 关键字。

let 的声明方式与 var 相同，用 let 来代替 var 来声明变量，就可以把变量限制在当前代码块中。

使用 const 声明的是常量，其值一旦被设定便不可被更改。

for (let i = 0; i < 10; i++) {
  //for循环的计数器，就很合适使用let命令。
}

console.log(i);// ReferenceError: i is not defined

作用域链：

当在JavaScript中查找变量时，会沿着一个称为作用域链的结构进行查找。作用域链的工作原理如下：

1. 首先，在函数内部查找是否有局部变量（使用var、let或const声明）与所查找的变量名匹配。
2. 如果没有找到匹配的局部变量，JavaScript引擎会查看当前函数的外部作用域（即包含该函数的作用域）。这通常是父级函数的作用域。
3. 如果在外部作用域中仍未找到匹配的变量，JavaScript会继续向上查找，直到到达全局作用域。
4. 如果在全局作用域中仍然找不到匹配的变量，那么该变量就是未定义的。

这种从内部作用域到外部作用域的查找过程形成了一个链式结构，称为作用域链。

// 全局作用域
let a=1
// 局部作用域
function f() {
    let a=1
    // 局部作用域
    function g() {
        a=2
        console.log(a)
    }
    g() // 调用g
}
f() // 调用f