首页 > 其他 > 详细

防抖和节流

时间:2021-04-17 20:18:46      阅读:17      评论:0      收藏:0      [点我收藏+]

防抖和节流

两者都是在一段时间内连续触发同一事件而为了避免事件处理函数频繁连续的调用而采取的解决方案。

防抖就是合并一段时间内连续的触发的事件

而节流控制相同事件之间必须要具有一定的时间间隔

打个比方,假如同一事件在10秒内触发了N次,如果采用防抖的方案,那么事件处理函数在10秒内只会触发一次。而如果采用节流的方案,可能就是在每间隔1秒的地方触发一次。

防抖的代码:

function debounce(fn, wait) {
  let timer = null;
  
  return () => {
    if (timer !== null) {
      clearTimeout(timer);
    }

    timer = setTimeout(() => fn(), wait);
  };
}

节流:

function throttle(fn, delay) {
    let pre = null;
    
    return () => {
        const now = Date.now();

        if (pre !== null && now - pre < delay) {
            return ;
        }

        fn();
        pre = now;
    }
}

防抖和节流

原文:https://www.cnblogs.com/freesfu/p/14671704.html

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