账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    防抖函数高级写法
    32
    0

    防抖函数是否有更高级的写法

    相关代码

        function debounce(fn) {
            let timeout = null;
            return function () {
                if(!timeout) {
                    fn.apply(this,arguments);
                    timeout = setTimeout(() => {
                        // clearTimeout(timeout); // 清除定时器操作
                        timeout = null
                    }, 500);
                }
            }
        }
    
        function say(e) {
            console.log('防抖了哦',e)
        }
    
        btn.addEventListener('click', debounce(say))
    
    

    防抖有两种写法,一种是先执行函数,第二种是后执行函数。这里写的是前者。

    思路

    1. 将我们我们需要的函数(既say函数)进行防抖化
    2. 在绑定监听事件中,防抖函数执行,返回一个闭包函数
    3. 每次点击执行该闭包函数
    4. 第一次点击,立即执行say函数,当在规定的时间内再次点击时,say函数不执行
    5. 等规定时间过后,点击方可执行

    问题

    1. 通过在setTimeout函数里 执行timeout = null,而不执行清除函数的操作可以达到效果,但是这样做可行?
    2. 改函数返回一个闭包函数,是否会有内存泄漏以及在点击多次后对内存产生的一些影响

    特此鸣谢前来围观的各路侠客

    希望大佬们能多维度的评价这种写法的好与坏,以及可用性等。
    因此方交流,而不忘于江湖[抱拳]

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 10 元积分
        全部回答
    • 0
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部