在 JavaScript 中，作用域和闭包是两个至关重要的概念。理解它们不仅能帮助你编写更高效和可维护的代码，还能让你更好地掌握 JavaScript 的核心特性。本文将详细介绍这两个概念及其应用。

一、JavaScript 作用域

作用域（Scope）是指代码中变量和函数的可访问范围。在 JavaScript 中，主要有三种作用域：全局作用域、函数作用域和块级作用域。

1. 全局作用域（Global Scope）

任何在函数之外声明的变量都具有全局作用域。它们在整个 JavaScript 程序中都可以访问。

var globalVar = 'I am global';

function globalFunc() {
    console.log(globalVar); // I am global
}

globalFunc();
console.log(globalVar); // I am global

在上述代码中，变量 globalVar 和函数 globalFunc 都处于全局作用域，因此它们可以在任何地方被访问。

2. 函数作用域（Function Scope）

在函数内部声明的变量只在该函数内部可见，这就是函数作用域。

function localFunc() {
    var localVar = 'I am local';
    console.log(localVar); // I am local
}

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

在这个例子中，localVar 只在 localFunc 函数内部可见，尝试在函数外部访问它会导致错误。

3. 块级作用域（Block Scope）

let 和 const 关键字引入了块级作用域，变量只在声明它们的块内有效。

if (true) {
    let blockVar = 'I am block level';
    console.log(blockVar); // I am block level
}

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

在这个示例中，blockVar 只在 if 块内可见，尝试在块外部访问它会导致错误。

二、JavaScript 闭包

闭包（Closure）是指有权访问另一个函数作用域中的变量的函数。闭包可以记住并访问其词法作用域，即使在其词法作用域之外执行时。

闭包示例
function outerFunction(outerVariable) {
    return function innerFunction(innerVariable) {
        console.log('Outer Variable: ' + outerVariable);
        console.log('Inner Variable: ' + innerVariable);
    }
}

const newFunction = outerFunction('outside');
newFunction('inside');

// 输出:
// Outer Variable: outside
// Inner Variable: inside

在这个例子中，innerFunction 是一个闭包，它捕获了 outerFunction 的变量 outerVariable，并且能够在 outerFunction 执行结束后依然访问 outerVariable。

闭包的应用场景
  1. 创建私有变量：
    闭包可以用来创建私有变量，从而保护数据的隐私。
function createCounter() {
    let count = 0;
    return {
        increment: function() {
            count++;
            return count;
        },
        decrement: function() {
            count--;
            return count;
        },
        getCount: function() {
            return count;
        }
    }
}

const counter = createCounter();
console.log(counter.increment()); // 1
console.log(counter.increment()); // 2
console.log(counter.decrement()); // 1
console.log(counter.getCount());  // 1

在这个例子中，count 变量只能通过 increment、decrement 和 getCount 方法访问，外部无法直接访问 count。

  1. 函数工厂：
    闭包可以用来创建函数工厂，根据输入生成不同的函数。
function createAdder(x) {
    return function(y) {
        return x + y;
    };
}

const add5 = createAdder(5);
console.log(add5(2)); // 7
console.log(add5(10)); // 15

在这个例子中，createAdder 函数生成一个新的函数，该函数能够访问 createAdder 的参数 x。

  1. 模拟块级作用域（在 let 和 const 出现之前）：
    在 let 和 const 出现之前，可以使用立即执行函数表达式（IIFE）来模拟块级作用域。
for (var i = 0; i < 3; i++) {
    (function(j) {
        setTimeout(function() {
            console.log(j); // 0, 1, 2
        }, 1000);
    })(i);
}

使用 IIFE 来创建块级作用域，使得每次迭代的 i 都被封闭在自己的作用域内，从而避免了闭包捕获的变量在循环结束后的值。

总结

JavaScript 中的作用域和闭包是非常强大的特性。作用域决定了变量和函数的可访问范围，而闭包允许函数在其外部作用域被调用时仍能访问其作用域内的变量。理解和善用这些概念能让你编写出更灵活、高效和可维护的代码。