zoukankan      html  css  js  c++  java
  • 【随笔】一个简单的JavaScript异步处理事件队列

    当我们需要连续执行几个函数,而这几个函数会一直对页面元素进行操作时,很可能页面会出现短暂的卡,然后,一下子爆炸性的出现所有信息。

    一般我们会用setTimeout(fn,0);这种来执行,其实js的setTimeout,特别是IE6的,响应时间最快也要17毫秒左右,所以,设置成0,意义不大。

    而且,这种做法,存在不连续,不连贯性。所以,自己写了个简单的。

     1 /**
     2  * @author floyd
     3  * @name 异步处理事件队列
     4  * @example var qe = new QueneEnginer();qe.add(fn,context,arrParam);qe.start();
     5  */
     6 
     7 var QueneEnginer = function(){
     8 
     9     this.Quene = [];
    10 }
    11 QueneEnginer.prototype = {
    12     processTime : 20,
    13     /**
    14      * 添加事件到队列中
    15      * @param {function} fn 函数对象
    16      * @param {object} context 上下文对象 可为空
    17      * @param {array} arrParam 参数数组 可为空
    18      */
    19     add : function(fn,context,arrParam){
    20 
    21         this.Quene.push(
    22             {
    23                 fn : fn,
    24                 context : context,
    25                 param : arrParam
    26             }
    27         );
    28     },
    29     start : function(){
    30         var that = this;
    31         setTimeout(function(){that.process();},that.processTime);
    32     },
    33     process : function(){
    34         
    35         var quene = this.Quene.shift();
    36         
    37         if(!quene)return ;
    38 
    39         quene.fn.apply(quene.context,quene.param);
    40         
    41         quene = null;
    42         
    43         this.start();
    44     }
    45 }
  • 相关阅读:
    菜单范式
    PIC18F26K20
    单片机中串口通信模型
    STM8S103之GPIO
    STM8S103之ADC
    二叉树最近公共祖先
    全排列
    整数翻转
    完全二叉树节点个数
    二叉树的深度
  • 原文地址:https://www.cnblogs.com/floyd/p/1993841.html
Copyright © 2011-2022 走看看