手写节流函数-基本实现

  <button class="btn">按钮</button>
  <!-- <script src="./js/underscore.js"></script> -->
  <script>
    function hdcthrottle(fn,time){
      //获取开始时间
      let startTime = 0
      const _throttleFn= function(){
        //每次点击获取点击的时间
       const nowTime = new Date().getTime()
      //  等待的时间 = 间隔时间 -(每次点击的时间-开始时间)
       let waitTime = time - (nowTime - startTime)
        if(waitTime <= 0 ){
          fn.apply(this)
          // 让开始时间等于下次执行点击的时间
          startTime = nowTime
        }
      }
      return _throttleFn
    }
  </script>
  <script>
    const btnEl = document.querySelector(".btn")
    let index = 1
    btnEl.onclick =hdcthrottle(function(){
      console.log(`第${index++}次执行`,this.value)
    },1000)
  </script>
posted @   韩德才  阅读(4)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示