• 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))
  • 相关阅读:
    Enable mod_rewrite in apache2.2
    静态注册BroadcastReceiver内部类
    Install MySQL Server 5 on Ubuntu
    Install PHP and Apache
    Android BroadcastReceiver应用详解
    C 简易贪吃蛇的编写
    MyBatis学习存档(1)——入门
    MyBatis学习存档(2)——核心配置文件
    Maven学习存档(2)——settings.xml配置
    Java中的float、double计算精度问题
  • 原文地址:https://www.cnblogs.com/liuXiaoDi/p/12593482.html
Copyright © 2020-2023  润新知