闭包使用场景

最新推荐文章于 2024-09-27 10:50:34 发布

Tand.

最新推荐文章于 2024-09-27 10:50:34 发布

阅读量4k

点赞数 2

分类专栏：笔试题文章标签： javascript 前端

本文链接：https://blog.csdn.net/weixin_45847735/article/details/121781255

版权

本文介绍了JavaScript闭包的四个常见应用场景：1) 通过闭包实现setTimeout的参数传递；2) 作为回调函数用于响应用户事件；3) 实现函数防抖功能，优化性能；4) 封装私有变量，保护内部状态。通过对这些场景的分析，阐述了闭包在前端开发中的重要性和使用技巧。

摘要由CSDN通过智能技术生成

场景一：采用函数引用方式的setTimeout调用（和click一样）
闭包的一个通常的用法是为一个在某一函数执行前先执行的函数提供参数。例如，在web环境中，一个函数作为setTimeout函数调用的第一个参数，是一种很常见的应用。setTimeout将要执行的函数(或者一段javascript代码，但这不是我们要讨论的情况)作为它的第一个参数，下一个参数是需要延迟执行的时间。如果一段代码想通过setTimeout来调用，那么它需要传递一个函数对象的引用来作为第一个参数。延迟的毫秒数作为第二个参数，但这个函数对象的引用无法为将要被延迟执行的对象提供参数。
但是，可以调用另一个函数来返回一个内部函数的调用，将那个内部函数对象的引用传递给setTimeout函数。内部函数执行时需要的参数，在调用外部函数时传递给它。setTimeout在执行内部函数时无需传递参数，因为内部函数仍然能够访问外部函数调用时提供的参数
原生的setTimeout传递的第一个函数不能带参数，通过闭包可以实现传参效果。

function f1(a) {
   
    function f2() {
   
        console.log(a);
    }
    return f2;
}
var fun = f1(1);
setTimeout(fun,1000);//一秒之后打印出1

场景二：回调
回调定义行为，然后把它关联到某个用户事件上（点击或者按键）。代码通常会作为一个回调（事件触发时调用的函数）绑定到事件。
比如下面这段代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
</head

最低0.47元/天解锁文章