什么是闭包以及它在javascript中如何工作？【教程】

大家好，今天本人给大家带来文章《什么是闭包以及它在javascript中如何工作？【教程】》，文中内容主要涉及到，如果你对文章方面的知识点感兴趣，那就请各位朋友继续看下去吧~希望能真正帮到你们，谢谢！

闭包是函数与其词法作用域的组合，需同时满足：存在内部函数、该函数脱离原始作用域、执行时仍访问外层变量。典型例子为createCounter返回递增函数，使count持续被引用；常见误用包括循环中var共享变量和闭包导致DOM内存泄漏。

闭包不是某种特殊函数，而是函数与其词法作用域的组合——只要一个函数在定义它的作用域外部被调用，且仍能访问该作用域中的变量，它就在使用闭包。

闭包产生的必要条件

必须同时满足三个条件：

• 存在一个内部函数（function 声明或表达式）
• 该内部函数被返回、传递或以其他方式脱离其原始词法作用域
• 该内部函数实际执行时，仍能读写其外层函数的局部变量（如 count、config）

缺一不可。常见误解是“有嵌套就有闭包”，其实没被带出去执行，就只是普通嵌套。

return 函数时闭包才真正“活”起来

看这个典型例子：

function createCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}
const inc = createCounter(); // 此时闭包形成
console.log(inc()); // 1
console.log(inc()); // 2

关键点：

• createCounter() 执行完后，其执行上下文本应销毁，但 count 被内部函数“捕获”，不能被 GC 回收
• 每次调用 inc()，操作的仍是同一份 count，不是副本
• 如果把 return 改成直接调用（如 return fn();），那就没闭包——函数立刻执行并返回值，不保留对外部变量的引用

闭包常被误用的两个坑

一是循环中创建闭包却共享变量：

for (var i = 0; i  console.log(i), 100); // 全输出 3
}

原因：var 声明提升 + 闭包捕获的是变量本身，不是当前值。修复方式：用 let（块级绑定）、IIFE 或 setTimeout 第三个参数传参。

二是无意中造成内存泄漏：

• 闭包长期持有 DOM 引用（如事件回调里存了 el），而 DOM 节点又被移除，但 JS 无法释放——因为闭包还在
• Node.js 中监听 eventEmitter 时用匿名函数，后续无法 removeListener，导致监听器越积越多

解决思路始终一致：明确谁持有引用、何时该断开。闭包本身无害，失控的引用链才有问题。

真正难的不是理解闭包机制，而是判断某个变量是否被某个闭包意外延长了生命周期——这需要结合调用链和引用图来推演，而不是靠记忆规则。

以上就是《什么是闭包以及它在javascript中如何工作？【教程】》的详细内容，更多关于的资料请关注golang学习网公众号！