JavaScript相关（二）——闭包

最新推荐文章于 2025-04-11 11:54:03 发布

sasaraku.

最新推荐文章于 2025-04-11 11:54:03 发布

阅读量433

点赞数 11

分类专栏： JS & TS 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/SaRAku/article/details/136074836

版权

JS & TS 专栏收录该内容

9 篇文章

订阅专栏

本文解释了闭包的概念，包括其如何通过引用外部作用域变量保持持久，以及闭包的回收机制。特别关注了内存管理问题，如全局变量闭包可能导致的内存泄漏，并举例说明了闭包在防抖、节流、DOM事件和异步处理中的实际应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

了解闭包的前提必须得了解什么是作用域链。也就是（一）的内容。

参考：
浏览器工作原理与实践
 破解前端面试：从闭包说起

闭包

闭包是一个可以访问外部作用域中变量的内部函数，因为内部函数引用了外部函数的变量，导致这些变量无法被回收，将持久保存在作用域内，这就形成了一个闭包。
这些被引用的变量直到闭包被销毁时才会被销毁。

在 JavaScript 中，根据词法作用域的规则，内部函数总是可以访问其外部函数中声明的变量，当通过调用一个外部函数返回一个内部函数后，即使该外部函数已经执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，我们就把这些变量的集合称为闭包。比如外部函数是 foo，那么这些变量的集合就称为 foo 函数的闭包。
闭包必须要引用到外部函数的变量，如果没有引用到的话，外部函数执行完之后，JS引擎执行垃圾回收时会认为这个外部函数已经执行完了，执行环境中没有变量被正在引用或者使用，所以可以销毁。

闭包的回收

如果闭包是一个全局变量，页面关闭时它才会被回收，如果是局部变量，则引用它的函数执行完毕后，JS引擎垃圾回收时会将它销毁。
如果这个全局变量的闭包占用了许多内存，又以后不再使用的话，就会造成内存泄漏（该内存空间使用完毕之后未被回收）。
因此如果该闭包会一直使用，那么它可以作为全局变量而存在；但如果使用频率不高，而且占用内存又比较大的话，那就尽量让它成为一个局部变量。

使用

其实我们经常使用到了闭包却没有发现。

防抖节流，setTimeout
```
(function autorun(){
    let x = 1;
    setTimeout(function log(){
      console.log(x);
    }, 10000);
})();
```
变量 x 将一直存活着直到定时器的回调执行或者 clearTimeout() 被调用。如果这里使用的是 setInterval() ，那么变量 x 将一直存活到 clearInterval() 被调用。
DOM节点事件
```
(function autorun(){
    let x = 1;
    $("#btn").on("click", function log(){
      console.log(x);
    });
})();
```
当变量 x 在事件处理函数中被使用时，它将一直存活直到该事件处理函数被移除。

异步事件 Promise

(function autorun(){
    let x = 1;
    fetch("http://").then(function log(){
      console.log(x);
    });
})();

变量 x 将一直存活到接收到后端返回结果，回调函数被执行。