【随笔】一个简单的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 }