web防抖（前端中的防抖和节流）
时间2025-05-05 07:10:16分类IT科技浏览3150
导读：一、背景...
一 、背景
在日常使用中 ，用户在进行搜索时 ，没输入一个字就会触发接口请求 ，这样就会造成网络请求繁忙；用户在下拉滚动调的时候 ，由于速度过快也会造成频繁触发接口调用 。
二 、防抖
防抖 ，顾名思义 ，防止抖动 。用于将用户的操作行为触发转换为程序行为触发 ，防止用户操作的结果抖动 。一段时间内 ，事件在我们规定的间隔 n 秒内多次执行 ，回调只会执行一次 。
三 、节流
节流 ，顾名思义 ，控制流量 。用于用户在与页面交互时控制事件发生的频率 ，一般场景是单位的时间或其它间隔内定时执行操作 。一段时间内 ，事件在每次到达我们规定的间隔 n 秒时触发一次 。
1 /**
2 * 节流
3 * @param {function} fn
4 * @param {number} delay
5 */
6 function throttle(fn, delay = 100){
7 let timer = null
8 return function(){
9 if(timer) return
10 timer = setTimeout(()=>{
11 fn.apply(this, arguments)
12 timer = null
13 }, delay)
14 }
15 }
声明：本站所有文章 ，如无特殊说明或标注 ，均为本站原创发布 。任何个人或组织 ，在未征得本站同意时 ，禁止复制 、盗用 、采集 、发布本站内容到任何网站 、书籍等各类媒体平台 。如若本站内容侵犯了原著者的合法权益 ，可联系我们进行处理 。
创心域SEO版权声明：以上内容作者已申请原创保护，未经允许不得转载，侵权必究！授权事宜、对本内容有异议或投诉，敬请联系网站管理员，我们将尽快回复您，谢谢合作！
