zoukankan      html  css  js  c++  java
  • 设计模式(节流模式)

        今天来说说节流模式。平时对于重复的业务逻辑进行节流控制,执行最后一次操作并取消其他操作调高性能。

        比如:可能有些朋友在做上拉加载(请求服务数据)迅速滑动时候会遇到这样的问题感觉一卡一卡的,一方面是请求服务器,另一方面是取到数据后进行数据渲染和操作dom(这块是很耗费资源的),还有一方面是没有做节流,每次监听到scroll事件,就调用对应的函数。打个比方:你让一个人去做一件事,刚通知完你去做吧,他正在努力干的时候,你又让他重复去干,第一次没完,就重复第二次,第三次……这样早晚会累死的(可能我说的不恰当,大家可以留言比喻,哈哈)效率可想而知。

       下边上节流代码:

       

     1         var throttle = function() {
     2                 var isClear = arguments[0],//存储第一个参数
     3                     fn;
     4                 if(typeof isClear === "boolean") {//判断第一个参数是否为boolean,清除定时器
     5                     fn = arguments[1];
     6                     console.dir(fn._throttleID)
     7                     fn._throttleID && clearTimeout(fn._throttleID)
     8                 } else {
     9                     fn = isClear;//isClear为函数对象复制给fn
    10                     param = arguments[1] || {};
    11                     var p = extend({   //设置默认参数
    12                         context: null,//执行函数时的作用域
    13                         args: [],//相关参数
    14                         time: 300//执行函数延迟时间
    15                     }, param);
    16                     arguments.callee(true, fn);//调用本函数 清除定时器 
    17                     fn._throttleID = setTimeout(function() {//计时
    18                         fn.apply(p.context, p.args)//调用函数回调函数
    19                     }, p.time);
    20                 }
    21             }

                extend扩展方法:

          

    1              var extend = function(olds, news) {
    2                 for(var index in news) {
    3                     olds[index] = news[index];
    4                 }
    5                 return olds;
    6             }

     总结:节流函数简单的想就是重复多次调用一个函数时候,只执行最后一次

       

  • 相关阅读:
    基于MINA实现server端心跳检测(KeepAliveFilter)
    TCP的TIME_WAIT快速回收与重用
    HDU4183 起点到终点再到起点 除起点每点仅经过一次 网络流
    oracle union 注入工具
    sqlmap注入技巧收集
    sqlmap的一些小技巧
    FCKeditor漏洞利用
    WAF绕过的技巧
    杨辉三角
    Oracle 常用入侵命令
  • 原文地址:https://www.cnblogs.com/hsp-blog/p/5893758.html
Copyright © 2011-2022 走看看