千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > 什么是过期闭包

什么是过期闭包

来源:千锋教育
发布人:zyh
时间: 2023-06-29 16:13:00 1688026380

  "过期闭包"(stale closure)是指闭包(Closure)中的变量引用的是旧的、已经过期的值的情况。

  闭包是指在一个函数内部创建的函数,并且该内部函数引用了其外部函数的变量。闭包可以让内部函数访问和操作外部函数中的变量,即使外部函数已经执行完毕,闭包仍然可以访问和保持对这些变量的引用。

什么是过期闭包

  当闭包中引用的外部变量发生变化时,闭包通常会跟随变化,并且可以正确地访问到最新的值。但在某些情况下,当闭包被创建时,它引用的外部变量的值是一个旧的值,而不是最新的值,这就是过期闭包。

  过期闭包的常见情况发生在使用循环变量(例如 `for` 循环中的计数器)创建闭包的时候。由于 JavaScript 中的变量作用域和变量共享机制,循环变量的值在每次迭代中都会被修改,但闭包在循环结束后才被调用,此时闭包中引用的循环变量值已经是循环结束时的最终值,而不是每次迭代的值。

  以下是一个经典的过期闭包示例:  

for (var i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i); // 输出 5,而不是预期的 0、1、2、3、4
}, 1000);
}

  在上述示例中,`setTimeout` 函数会在循环结束后,延迟一秒钟执行传入的函数。当这个函数被执行时,它引用的 `i` 变量已经是循环结束时的最终值 5,而不是每次迭代的值。因此,输出的结果会是 5,而不是预期的 0、1、2、3、4。

  为了避免过期闭包的问题,可以通过创建一个新的作用域来捕获每次迭代的值,例如使用 IIFE(立即调用函数表达式)或 ES6 中的块级作用域(使用 `let` 关键字)来解决该问题。这样可以确保每个闭包都引用正确的值。  

for (var i = 0; i < 5; i++) {
(function(index) {
setTimeout(function() {
console.log(index); // 输出 0、1、2、3、4
}, 1000);
})(i);
}

  在上述修改后的示例中,通过使用立即调用函数表达式(IIFE)创建一个新的作用域,并将每次迭代的值作为参数传递给该函数,确保每个闭包引用的是正确的值。这样就可以按预期输出 0、1、2、3、4。

声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT