首页 > 其他 > 详细

防抖与节流函数

时间:2019-04-11 18:12:45      阅读:106      评论:0      收藏:0      [点我收藏+]

场景:在开发搜索框的过程中,为了防止高频触发,减少不必要的性能浪费。我们需要用一种机制来阻止高频触发

两种实现方案:

1.防抖函数:在一定时间内多次执行以最后一次执行为准

    const debounce = (fn,duration)=>{
        let timer=null;
        let result=()=>{
            clearTimeout(timer);
            timer=setTimeout(fn,duration);
        }
        return result;
    }

2.节流函数:在一定时间段内只执行一次

const throttle=(fn,duration)=>{
        let timer=null;
        let result=()=>{
            if(timer){
                return false;
            }
            else{
                timer=setTimeout(()=>{
                    timer=null;
                    fn();
                },duration);
            }
        }
        return result;
    }

考虑到我们的搜索,只需要触发一次。故选择了防抖函数

不过这两种方案到是对函数闭包的一种很好的应用场景,(意外收获)

防抖与节流函数

原文:https://www.cnblogs.com/maoBable/p/10691341.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!