一页面多XMLHttpRequest对象


Posted in Javascript onJanuary 22, 2007

刚在ajacn发了个贴,关于为XMLHttpRequest提供一个对象池。或许能帮到你,转贴如下:

在网上看到了有些同志提到了为Ajax的XMLHttpRequest提供一个对象池,也读了他们给出的实现代码。感觉不是特别理想,于是模仿apache的commons中的ObjectPool的思路写了一个简单的JavaScript版。 
望指教: 

代码
function ObjectPool(poolableObjectFactory) {    
    this._poolableObjectFactory = poolableObjectFactory;    
    this._idlePool = [];     
    this._activePool = [];     
}    
// 从对象池中租借一个对象,如果目前没有可用的空闲对象则通过poolableObjectFactory创建一个    
// 既然是借的,用完记得一定要还哦!    
ObjectPool.prototype.borrowObject = function() {    
    var object = null;    
    var idlePool = this._idlePool;    
    var factory = this._poolableObjectFactory;    
    if (idlePool.length > 0) {    
        object = idlePool.pop();    
    }    
    else {    
        object = factory.makeObject();    
    }    
    if (object != null) {    
        this._activePool.push(object);    
        if (factory.activateObject) {    
            factory.activateObject(object);    
        }    
    }    
    return object;    
}    
// 归还一个对象    
ObjectPool.prototype.returnObject = function(object) {    
    function indexOf(array, object) {    
        for (var i = 0; i < array.length; i++) {    
            if (array[i] == object) return i;    
        }    
        return -1;    
    }    
    if (object != null) {    
        var activePool = this._activePool;    
        var factory = this._poolableObjectFactory;          
        var i = indexOf(activePool, object);    
        if (i < 0) return;          
        if (factory.passivateObject) {    
            factory.passivateObject(object);    
        }           
        activePool.splice(i, 1);    
        this._idlePool.push(object);    
    }    
}    
// 返回当前激活对象的个数    
ObjectPool.prototype.getNumActive = function() {    
    return this._activePool.length;    
}    
// 返回当前空闲对象的个数    
ObjectPool.prototype.getNumIdle = function() {    
    return this._idlePool.length;    
}    
// 销毁对象池及其中的所有对象    
// 如果对象池中的对象需要析构。那么必须实现poolableObjectFactory中的destroyObject方法,同时保证ObjectPool的destroy方法在需要的时候被调用到(例如Window的unload事件中)。    
ObjectPool.prototype.destroy = function() {    
    var factory = this._poolableObjectFactory;    
    function returnObject(object) {    
        if (factory.passivateObject) {    
            factory.passivateObject(object);    
        }    
    }    
    function destroyObject(object) {    
        if (factory.destroyObject) {    
            factory.destroyObject(object);    
        }    
    }       
    var activePool = this._activePool;    
    for (var i = 0; i < activePool.length; i++) {    
        var object = activePool[i];    
        returnObject(object);    
        destroyObject(object);    
    }    
    var idlePool = this._idlePool;    
    for (var i = 0; i < idlePool.length; i++) {    
        var object = idlePool[i];    
        destroyObject(object);    
    }    
    this._idlePool = null;     
    this._activePool = null;     
    this._poolableObjectFactory = null;    
}   

上面代码中ObjectPool的构造参数poolableObjectFactory的声明如下: 

代码
// 注意: 这只是说明,不是真正的代码!    
var PoolableObjectFactory = {           
    makeObject: function() {}, // 创建一个新的对象。(必须声明)       

    activateObject: function(object) {}, // 当一个对象被激活时(即被借出时)触发的方法。(可选)    

    passivateObject: function(object) {}, // 当一个对象被钝化时(即被归还时)触发的方法。(可选)    

    destroyObject: function(object) {} // 销毁一个对象。(可选)           
};    

结合XMLHttpRequest创建过程的简陋示例: 

代码
// 声明XMLHttpRequest的创建工厂    
var factory = {         
    makeObject: function() {    
        // 创建XMLHttpRequset对象    
        // 注:这里的创建方法不够强壮,勿学!    
        if (window.ActiveXObject){    
            return new ActiveXObject("Microsoft.XMLHTTP");    
        }    
        else {    
            return new XMLHttpRequest();    
        }    
    },              
    passivateObject: function(xhr) {    
        // 重置XMLHttpRequset对象    
        xhr.onreadystatechange = {};    
        xhr.abort();    
    }    
};    
var pool = new ObjectPool(factory); // 创建对象池    
// ......    
var xhr = pool.borrowObject(); // 获得一个XMLHttpRequest对象    
xhr.onreadystatechange = function() {    
    if (xhr.readyState == 4) {    
        // ......    
        pool.returnObject(xhr); // 归还XMLHttpRequest对象    
    }    
};    
xhr.open(method, url, true);    
// ......    

最后附上jsUnit的测试用例: 

代码
function test_pool() {    
    var factory = {    
        counter: 0,    

        makeObject: function() {    
            return {id: ++ this.counter};               
        },          

        activateObject: function(object) {    
            object.activated = true;    
        },    

        passivateObject: function(object) {    
            object.activated = false;               
        },    

        destroyObject: function(object) {    
            object.destroyed = true;                
        }    
    };    
    var pool = new ObjectPool(factory);    
    // borrowObject object1    
    var object1 = pool.borrowObject();    
    assertEquals(object1.id, 1);    
    assertTrue(object1.activated);    
    assertEquals(factory.counter, 1);    
    assertEquals(pool.getNumActive(), 1);    
    assertEquals(pool.getNumIdle(), 0);    
    // borrowObject object2    
    var object2 = pool.borrowObject();    
    assertEquals(object2.id, 2);    
    assertTrue(object2.activated);    
    assertEquals(factory.counter, 2);    
    assertEquals(pool.getNumActive(), 2);    
    assertEquals(pool.getNumIdle(), 0);    
    // borrowObject object3    
    var object3 = pool.borrowObject();    
    assertEquals(object3.id, 3);    
    assertTrue(object3.activated);    
    assertEquals(factory.counter, 3);    
    assertEquals(pool.getNumActive(), 3);    
    assertEquals(pool.getNumIdle(), 0);    
    // returnObject object2    
    pool.returnObject(object2);    
    assertFalse(object2.activated);    
    assertEquals(factory.counter, 3);    
    assertEquals(pool.getNumActive(), 2);    
    assertEquals(pool.getNumIdle(), 1);    
    // returnObject object3    
    pool.returnObject(object3);    
    assertFalse(object3.activated);    
    assertEquals(pool.getNumActive(), 1);    
    assertEquals(pool.getNumIdle(), 2);    
    // returnObject object1    
    pool.returnObject(object1);    
    assertFalse(object1.activated);    
    assertEquals(pool.getNumActive(), 0);    
    assertEquals(pool.getNumIdle(), 3);         
    // destroy the pool    
    pool.destroy();    
    assertTrue(object1.destroyed);    
    assertTrue(object2.destroyed);    
    assertTrue(object3.destroyed);    
}  

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(5)
Dec 23 Javascript
jquery延迟加载外部js实现代码
Jan 11 Javascript
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
Sep 22 Javascript
JavaScript日期时间格式化函数分享
May 05 Javascript
浅谈javascript基础之客户端事件驱动
Jun 10 Javascript
javascript中的后退和刷新实现方法
Nov 10 Javascript
在小程序中集成redux/immutable/thunk第三方库的方法
Aug 12 Javascript
angular实现input输入监听的示例
Aug 31 Javascript
详解bootstrap-fileinput文件上传控件的亲身实践
Mar 21 Javascript
Vue移动端用淘宝弹性布局lib-flexible插件做适配的方法
May 26 Javascript
详解React 元素渲染
Jul 07 Javascript
JavaScript 几种循环方式以及模块化的总结
Sep 03 Javascript
javascript 播放器 控制
Jan 22 #Javascript
JAVASCRIPT HashTable
Jan 22 #Javascript
Maps Javascript
Jan 22 #Javascript
自适应高度框架 ----属个人收藏内容
Jan 22 #Javascript
Opacity.js
Jan 22 #Javascript
html读出文本文件内容
Jan 22 #Javascript
用ADODB.Stream转换
Jan 22 #Javascript
You might like
php checkbox 取值详细说明
2010/08/19 PHP
解析PHP中的正则表达式以及模式匹配
2013/06/19 PHP
ie与session丢失(新窗口cookie丢失)实测及解决方案
2013/07/15 PHP
php用header函数实现301跳转代码实例
2013/11/25 PHP
PHP中单例模式的使用场景与使用方法讲解
2019/03/18 PHP
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
2019/12/31 PHP
关于跨站脚本攻击问题
2011/12/22 Javascript
动态改变div的z-index属性的简单实例
2013/08/08 Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
2014/07/17 Javascript
JS输入用户名自动显示邮箱后缀列表的方法
2015/01/27 Javascript
JavaScript更改原始对象valueOf的方法
2015/03/19 Javascript
JS、jQuery中select的用法详解
2016/04/21 Javascript
用js实现博客打赏功能
2016/10/24 Javascript
Three.js的使用及绘制基础3D图形详解
2017/04/27 Javascript
AngularJs定时器$interval 和 $timeout详解
2017/05/25 Javascript
Vue学习笔记进阶篇之函数化组件解析
2017/07/21 Javascript
vue 中filter的多种用法
2018/04/26 Javascript
微信小程序之onLaunch与onload异步问题详解
2019/03/28 Javascript
原生js拖拽实现图形伸缩效果
2020/02/10 Javascript
Vue(定时器)解决mounted不能获取到data中的数据问题
2020/07/30 Javascript
python读取文件名称生成list的方法
2018/04/27 Python
Win10系统下安装labelme及json文件批量转化方法
2019/07/30 Python
python3 selenium自动化 frame表单嵌套的切换方法
2019/08/23 Python
python实现静态web服务器
2019/09/03 Python
使用Python给头像加上圣诞帽或圣诞老人小图标附源码
2019/12/25 Python
Python开发之基于模板匹配的信用卡数字识别功能
2020/01/13 Python
python实现信号时域统计特征提取代码
2020/02/26 Python
Django调用百度AI接口实现人脸注册登录代码实例
2020/04/23 Python
CSS3用@font-face实现自定义英文字体
2013/09/23 HTML / CSS
马来西亚最大的在线隐形眼镜商店:MrLens
2019/03/27 全球购物
Monica Vinader官网:英国轻奢珠宝品牌
2020/02/05 全球购物
汽修专业学生自我鉴定
2013/11/16 职场文书
工作态度检讨书
2014/02/11 职场文书
民主生活会批评与自我批评总结
2014/10/17 职场文书
学生喝酒检讨书500字
2014/11/02 职场文书
党员带头倡议书
2015/04/29 职场文书