• javascript-函数节流理解和仿写


    解释一下,我认为的函数节流:

    多次触发事件,但是一个规定时间内,该事件只会执行一次

    具体例子,我第一次触发事件,开始计时,在后续的多次事件触发中,某次触发的时间距离我开始计时的时间,他们的时间间隔达到了规定的时间段,这是我们就会执行一次该事件,并把该事件的执行时间作为新的开始计时,以此循环,保证在一段时间内,只有一次执行,大大降低了函数的执行频率.这就是函数节流

    常见的场景:我们下滑页面,在下滑到一定程度时,会出现返回顶部按钮,正常情况下,我们每下滑一下,都会是返回顶部事件多次计算当前距离,而当我们用函数节流后,在一段事件内只会触发一次,降低了事件的触发频率,达到了性能优化

     编写思路就是利用闭包可以长时间保存某个变量,并且在外部可以访问

    function throlle(callback,delay){
      let startTime=0;
      return function (){
        //使用new Date().getTime(),这样首次操作一定会执行
        let endTime=new Date().getTime();
        //第一次减法一定大雨delay,确保首次操作一定会执行
        if(endTime-startTime>delay){
          callback.apply(this,arguments)
          startTime=new Date().getTime();
        }
      }
    }
    document.getElementById('box').addEventListener('click',throlle(()=>{
    console.log(11);
    },1000))
  • 相关阅读:
    第07组 Alpha冲刺(2/4)
    第07组 Alpha冲刺(1/4)
    团队项目-需求分析报告
    团队项目-选题报告
    1381 硬币游戏
    1381 硬币游戏
    1347 旋转字符串
    1344 走格子
    1305 Pairwise Sum and Divide
    1384 全排列
  • 原文地址:https://www.cnblogs.com/liuXiaoDi/p/12593482.html
Copyright © 2020-2023  润新知