防抖的源代码

在路上等

于 2022-03-02 20:58:57 发布

阅读量519

点赞数

CC 4.0 BY-SA版权

分类专栏： js练习文章标签：前端

本文链接：https://blog.youkuaiyun.com/weixin_42327537/article/details/123240138

js练习专栏收录该内容

11 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文深入探讨了前端开发中的防抖技术，通过实例解释其工作原理，并提供了源代码实现，帮助开发者优化性能，避免频繁触发函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

let inp = document.querySelector('input');
               // oninput 事件在元素值发生变化是立即触发
               inp.oninput = debounce(function(){
                   console.log(this.value)
               },500) 
               
                function debounce(fn,delay){
                    let t = null;
                    // let that = this (指向window)
                    return function(){
                        if(t !== null){
                            // clearTimeout() 方法可取消由 setTimeout() 方法设置的定时操作。
                            clearTimeout(t)
                        }
                        t = setTimeout(()=>{
                            // fn(that)
                            fn.call(this)
                        },delay)
                        }
                }