随笔 - 114,  文章 - 0,  评论 - 0,  阅读 - 70431
复制代码
// 防抖函数和节流函数, 使用方法antiShaking(() => {
                //   执行动作
                // })
                
let timer = null;      //time用来控制事件的触发

// 防抖
export function antiShaking(functionItem, timerType = "timer1", delay = 300, immediate = true, ) {
  //防抖语句
  if(timerObj[timerType] !== null){
    clearTimeout(timerObj[timerType]);
  }

  //如果是立即执行(开头结尾都执行)
  if (immediate) {
    //定义callNow = !timer
    var callNow = !timerObj[timerType];
    //定义delay时间后把timer变为null
    //即在delay时间之后事件才会有效
    timerObj[timerType] = setTimeout(() => {
      timerObj[timerType] = null;
      functionItem.apply(this, arguments)
    }, delay)
    //如果callNow为true,即原本timer为null
    //那么执行func函数
    if (callNow) functionItem.apply(this, arguments)
  } else {
    timerObj[timerType] = setTimeout(function() {
      functionItem.apply(this,arguments)
    }, delay)
  }
 
}


// 节流
export function throttle(fn, delay = 500) {
  if(timer) return
  timer = setTimeout(() => {
    fn.apply(this,arguments)
    timer = null
  }, delay)
}
复制代码

 

posted on   occc  阅读(26)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示