zoukankan      html  css  js  c++  java
  • 节流函数(throttle)的原理

    throttle节流函数,就是一个函数调用的频率控制器;

    var safe = true;
    function throttle() {
          if (safe) {
     	lazyLoad();
              	safe = false;
              	setTimeout(function() {
                  	safe = true;
              	}, 500);
          }
        }
    


    如下代码,safe每隔500ms才会为true,所以srollFn最快500ms执行一次。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body style="height:2000px">
    <script>
    
        /*throttle节流函数,就是一个函数调用的频率控制器;
         如下代码,safe每隔500ms才会为true,所以srollFn最快500ms执行一次。*/
    
        var num = 0;
        function lazyLoad() {
            num++;
            console.log(num);
        }
    
        var safe = true;
        function throttle() {
            if (safe) {
                lazyLoad();
                safe = false;
                setTimeout(function () {
                    safe = true;
                }, 1000);
            }
        }
        window.onscroll = throttle;
    
    
    </script>
    </body>
    </html>
  • 相关阅读:
    nginx原理及常用配置
    课程作业03-1
    Java动手动脑02
    Java课程作业02
    java课堂测试2
    Java验证码程序
    课程作业02-2
    课程作业02-1
    课程作业01
    《大道至简》第一章伪代码
  • 原文地址:https://www.cnblogs.com/aredleave/p/7573157.html
Copyright © 2011-2022 走看看