美文网首页
防抖和节流

防抖和节流

作者: Karsure | 来源:发表于2019-07-09 16:08 被阅读0次

    用户在操作事件的时候可能会手抖多次触发,比如一个提交事件触发多次向server端发送多次post或get请求,就要用到防抖和节流来限制了。

    防抖:

    function debounce(func){
        let timer; //设置一个空计时器
        return ()=>{
            clearTimeout(timer); //每次触发时都清掉上一个计时器
            //然后重新设置计时器
            timer = setTimeout(function(){
                  func.apply(this,arguments);
            } ,500);
        }
    }

    节流:

    function debounce(func){
        let running = false; //事件没有点击的时候为false。 防抖和节流的区别就在这里了
        return ()=>{
            if(running) return ; //running为true就直接返回
            running = true;
            setTimeout(function(){
               func.apply(this,arguments)
               running=false; //500ms执行完了 running设置为false
            },500);
        }
    }

    道理咱都懂,就是名字起的真是一下子没明白

    相关文章

      网友评论

          本文标题:防抖和节流

          本文链接:https://www.haomeiwen.com/subject/khaxkctx.html