闭包：JavaScript 中的“记忆魔法”，让你的函数记住一切！

​

你是否曾经好奇，为什么 JavaScript 中的函数可以"记住"它被创建时的环境？为什么有些变量在函数执行完毕后仍然"活"在内存中？这一切的背后，都离不开一个神奇的概念------闭包。

闭包是 JavaScript 中最强大且最容易被误解的特性之一。它不仅是面试中的高频考点，更是实际开发中的利器。本文将带你揭开闭包的神秘面纱，通过生动的代码示例，让你彻底掌握这一"记忆魔法"！

---

闭包是什么？它为什么如此神奇？

闭包是指一个函数能够访问并记住其词法作用域中的变量，即使这个函数在其词法作用域之外执行。简单来说，闭包让函数拥有了"记忆"能力。

闭包的三大神奇特性：

1. 函数嵌套：闭包通常发生在函数嵌套的场景中。
2. 访问外部变量：内部函数可以访问外部函数的变量。
3. 变量常驻内存：闭包会让外部函数的变量在函数执行完毕后仍然保留在内存中。

---

闭包的原理

要理解闭包，首先需要了解 JavaScript 的作用域链。

作用域链

JavaScript 中的作用域是词法作用域，也就是说，作用域在代码编写时就已经确定，而不是在运行时确定。当函数被创建时，它会保存一个对其外部作用域的引用，这个引用链就是作用域链。

闭包的形成

当一个函数返回另一个函数时，返回的函数会保留对其外部函数作用域的引用，即使外部函数已经执行完毕。这种机制就是闭包。

---

代码示例

demo 1：最简单的闭包

function outer() {
    let count = 0; // 外部函数的变量

    function inner() {
        count++; // 内部函数访问外部函数的变量
        console.log(count);
    }

    return inner; // 返回内部函数
}

const closureFunc = outer(); // outer 执行完毕，但 count 仍然被 inner 记住
closureFunc(); // 输出 1
closureFunc(); // 输出 2
closureFunc(); // 输出 3

解释：

• outer 函数定义了一个变量 count，并返回了 inner 函数。
• inner 函数形成了一个闭包，它可以访问 outer 函数的 count 变量。
• 即使 outer 函数已经执行完毕，count 变量仍然被保留在内存中，每次调用 closureFunc 时都会修改并输出 count。

---

demo 2：闭包与循环的经典问题

闭包在循环中的应用是一个经典的面试题。以下代码展示了闭包在循环中的常见问题及其解决方法。

for (var i = 1; i <= 5; i++) {
    setTimeout(function() {
        console.log(i); // 输出什么？
    }, 1000);
}

输出结果：

6
6
6
6
6

问题分析：

• var 声明的变量是函数作用域，而不是块级作用域。
• setTimeout 是异步的，当回调函数执行时，循环已经结束，此时 i 的值是 6。

解决方法 ：

使用闭包或 let 关键字。

方法 1：使用闭包

for (var i = 1; i <= 5; i++) {
    (function(j) {
        setTimeout(function() {
            console.log(j);
        }, 1000);
    })(i);
}

方法 2：使用 let

for (let i = 1; i <= 5; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}

解释：

• 方法 1 通过立即执行函数（IIFE）创建了一个闭包，将每次循环的 i 值保存下来。
• 方法 2 使用 let 关键字，let 是块级作用域，每次循环都会创建一个新的 i。

---

示例 3：闭包与模块化

闭包可以用来实现模块化编程，隐藏私有变量，只暴露必要的接口。

function createCounter() {
    let count = 0; // 私有变量

    return {
        increment: function() {
            count++;
            console.log(count);
        },
        decrement: function() {
            count--;
            console.log(count);
        },
        getCount: function() {
            return count;
        }
    };
}

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

解释：

• createCounter 函数返回一个对象，对象中的方法形成了闭包，可以访问 count 变量。
• count 是私有变量，外部无法直接访问，只能通过暴露的方法进行操作。

---

闭包的应用场景

1. 数据封装：通过闭包实现私有变量，避免全局污染。
2. 函数柯里化：利用闭包保存部分参数，延迟执行函数。
3. 回调函数：异步编程中，闭包常用于保存上下文。
4. 模块化开发：通过闭包实现模块的封装和接口暴露。

---

闭包的注意事项

1. 内存泄漏：闭包会导致外部函数的变量常驻内存，如果不及时释放，可能会造成内存泄漏。
2. 性能问题：闭包会增加作用域链的长度，可能影响性能。

​