JavaScript中闭包不捕获this,只捕获词法变量;this由调用方式动态决定,故闭包内this常为默认绑定(global/undefined),需bind、箭头函数或缓存this解决。

JavaScript 中默认绑定失效在闭包内部,本质不是“this 绑定失效”,而是 闭包捕获的是词法作用域中的变量,而非执行时的 this 上下文。很多人误以为闭包会“继承”外层函数的 this,但其实闭包不自动绑定 this —— 它只保留对外部作用域中 变量 的引用,而 this 是运行时动态决定的,与词法环境无关。
闭包不保存 this,只保存词法变量
闭包的核心是“记住定义时的词法环境”,包括 let/const/var 声明的变量、参数、函数声明等。但 this 不属于词法环境的一部分,它由调用方式(如 obj.method()、func()、call/apply)在执行时确定。
- 即使外层函数的 this 指向某个对象,内部闭包函数若被单独调用(如作为回调传入 setTimeout 或事件监听器),this 仍会回退到默认绑定(非严格模式为 global,严格模式为 undefined)
- 闭包内部访问的 outerVar 是静态捕获的,但 this 是动态查找的 —— 二者机制完全不同
典型场景:事件回调或定时器中 this 丢失
常见于类方法或对象方法中返回闭包,却未正确绑定 this:
function createButtonHandler(label) {
const message = `Clicked: ${label}`;
return function() {
console.log(this); // 此处 this 很可能不是预期对象
console.log(message); // ✅ 闭包正常捕获 message(词法变量)
};
}
const handler = createButtonHandler('Save');
button.addEventListener('click', handler); // handler 单独调用 → this 默认绑定失效
- message 能正确输出,因为它是闭包捕获的词法变量
- this 指向 window(非严格)或 undefined(严格),并非 createButtonHandler 的调用者
如何让闭包内 this 指向预期对象?
闭包本身不解决 this 绑定问题,需额外处理:
立即学习“Java免费学习笔记(深入)”;
-
显式绑定:用
handler.bind(obj)或obj.handler.bind(obj) - 箭头函数:箭头函数不绑定自己的 this,而是继承外层函数的 this(注意:外层函数必须有确定的 this)
-
提前缓存 this:在闭包外层用
const self = this,闭包内访问 self - 使用 class 字段语法 + 箭头函数(ES2022+):确保方法绑定到实例
和 var 循环闭包坑的区别
这是两个独立问题:
- “var 循环闭包”是 变量共享导致值错乱(所有闭包引用同一个 i)
- “this 默认绑定失效”是 执行时上下文丢失导致 this 不对(闭包没毛病,只是 this 没被传进来)
- 前者靠块级作用域(let)修复;后者靠绑定策略修复


















