ajax这种常见的开发模式已经遍布我们日常的开发之中了,ajax本质还是采用一种轮询的模式,就是隔一段时间去发送一次http请求,获取数据,然后显示在页面之上,当然,ajax比起新兴的WebScoket肯定是差了一截,WebScoket基于握手协议,是一种全双工的通信。

  目前,很多javascript库都实现了对ajax完善的支持,像jQuery, Ext, Mootools, prototype等。平时是不是就简单的调用一下$.ajax()或者$.post()就轻松的实习了一次ajax请求了呢?如果你过于依赖jQuery等类库的话,你可能会忽略ajax的原生实现。下面我来谈谈ajax的原生实现。

  ajax中的核心对象是XMLHttpRequest。像Firefox、 chrome、 opera、 safari等浏览器可以直接通过new XMLHttpRequest()创建,IE6及IE6以下不支持这种方式创建,但是可以通过new ActiveXObject()创建。常见的HTTP状态码中,200表示请求已经发送成功,readyState一共有5种状态,0表示未连接,1表示打开连接,2表示发送请求,3表示交互,4表示完成交互并接手响应。了解了这些预备知识,我们就可以实现一个XHR工厂了。

/**
* XHR Factory, use simple factory patten
* It handle ajax create, request, send and etc
* Written by liufeng cheng
* update date: 2014/7/10
* call example:
window.onload = function(){
var xhrFactory = new XhrFactory();
var callback = {
success:function(responseText,responseXML){alert("Success:" + responseXML);},
failure:function(statusCode){alert("Failure" + statusCode);}
};
myHandler.request('GET','innerHTML.xml',callback);
};
*/
var XhrFactory = function(){}; XhrFactory.prototype = {
//ajax create,request,send and etc
request:function(method,url,callback,postVars){
var xhr = this.createXhrObject();
xhr.onreadystatechange = function(){
if(xhr.readyState != 4) return;
(xhr.status == 200) ?
callback.success(eval("(" + xhr.responseText + ")"), xhr.responseXML):
callback.failure(xhr.status);
};
xhr.open(method,url,true);
if(method != "POST") postVars = null;
xhr.send(postVars);
},
// return a xhr object in different case
createXhrObject:function(){
var methods = [
function(){return new XMLHttpRequest();},
function(){return new ActiveXObject('Msxml2.XMLHttp');},
function(){return new ActiveXObject('Microsoft.XMLHttp');}
];
for(var i = 0; i < 3; i++){
try{
methods[i]();
}catch(e){
continue;
}
this.createXhrObject = methods[i]();
return methods[i]();
}
throw new Error("Error!");
}
}

  

  

XHR工厂的实现的更多相关文章

  1. JavaScript设计模式--简单工厂模式例子---XHR工厂

    第一步,Ajax操作接口(目的是起一个接口检测作用) (1)引入接口文件 //定义一个静态方法来实现接口与实现类的直接检验 //静态方法不要写出Interface.prototype ,因为这是写到接 ...

  2. js设计模式-工厂模式(XHR工厂)

    场景:如果代码中需要多次执行Ajax请求,那么明智的做法是把创建这种对象的代码提取到一个类中,并创建一个包装器来包装在实际请求时所要经历的一系列步骤.简单工厂非常适合这种场合. /*AjaxHandl ...

  3. JS设计模式——7.工厂模式(示例-XHR)

    XHR工厂 基本实现 var AjaxHandler = new Interface('AjaxHandler', ['request', 'createXHR']); var SimpleHandl ...

  4. JavaScript设计模式-10.工厂模式实例xhr

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. java三种工厂模式

    适用场合: 7.3 工厂模式的适用场合 创建新对象最简单的办法是使用new关键字和具体类.只有在某些场合下,创建和维护对象工厂所带来的额外复杂性才是物有所值.本节概括了这些场合. 7.3.1 动态实现 ...

  6. 读书笔记之 - javascript 设计模式 - 工厂模式

    一个类或者对象中,往往会包含别的对象.在创建这种对象的时候,你可能习惯于使用常规方式,即用 new 关键字和类构造函数. 这会导致相关的俩个类之间产生依赖. 工厂模式,就是消除这俩个类之间的依赖性的一 ...

  7. JavaScript设计模式(3)-工厂模式

    工厂模式 1. 简单工厂 简单工厂:使用一个类或对象封装实例化操作 假如我们有个自行车商店类 BicycleShop,它提供了销售自行车的方法可以选择销售两类自行车 Speedster,Comfort ...

  8. 转载,javascript 设计模式

    了解JavaScript设计模式我们需要知道的一些必要知识点:(内容相对基础,高手请跳过) 闭包:关于闭包这个月在园子里有几篇不错的分享了,在这我也从最实际的地方出发,说说我的理解. 1.闭包最常用的 ...

  9. 【JavaScript设计模式系列---开篇预览】

    转:http://www.cnblogs.com/Darren_code/archive/2011/08/31/JavascripDesignPatterns.html 2011-08-31 23:5 ...

随机推荐

  1. CSAPP lab2 二进制拆弹 binary bombs phase_1

    这个实验从开始到完成大概花了三天的时间,由于我们还没有学习编译原理.汇编语言等课程,为了完成这个实验我投机取巧了太多,看了网上很多的解题方法,为了更加深入学习编译反编译,觉得需要从头开始好好梳理一下. ...

  2. 20135323符运锦----第三周:构建一个简单的Linux系统MenuOS

    相关知识点 1.arch目录 占据相当庞大的空间,X86目录下代码需要重点关注. 2.init目录 内核启动的相关代码基本都在此目录下,内含MAIN.C,文件中START_KERNEL是整个LINUX ...

  3. windows8/10+Ubuntu Kylin(优麒麟)双系统

    1.参考资料:http://www.jianshu.com/p/2eebd6ad284d 中第三种U盘启动方式安装完成 2.安装过程: (1)首先将一个盘空出来,做好其中数据的备份.启动win+X磁盘 ...

  4. 剑指offer:包含min函数的栈

    题目描述: 定义栈的数据结构,请在该类型中实现一个能够得到栈中所含最小元素的min函数(时间复杂度应为O(1)). 解题思路: 相当与在保留原栈的同时,去维护一个最小栈.利用一个辅助栈来完成.对于每个 ...

  5. ipmitool+python应用处理大量带外地址

    ipmitool 是一种可用在 linux 系统下的命令行方式的 ipmi 平台管理工具,它支持 ipmi 1.5 规范(最新的规范为 ipmi 2.0),通过它可以实现获取传感器的信息.显示系统日志 ...

  6. 深入解读Quartz的原理

     Quartz是一个大名鼎鼎的Java版开源定时调度器,功能强悍,使用方便.   一.核心概念   Quartz的原理不是很复杂,只要搞明白几个概念,然后知道如何去启动和关闭一个调度程序即可.   1 ...

  7. 基于SSM的Java Web应用开发原理初探

    SSM开发Web的框架已经很成熟了,成熟得以至于有点落后了.虽然如今是SOA架构大行其道,微服务铺天盖地的时代,不过因为仍有大量的企业开发依赖于SSM,本文简单对基于SSM的Java开发做一快速入门, ...

  8. BZOJ 3170 松鼠聚会(切比雪夫距离转曼哈顿距离)

    题意 有N个小松鼠,它们的家用一个点x,y表示,两个点的距离定义为:点(x,y)和它周围的8个点即上下左右四个点和对角的四个点,距离为1.现在N个松鼠要走到一个松鼠家去,求走过的最短距离. 思路 题目 ...

  9. oracle函数验证时间格式并返回

    CREATE OR REPLACE FUNCTION WSW(parameter VARCHAR2) RETURN DATE IS val DATE; BEGIN IF (REGEXP_INSTR(p ...

  10. 【刷题】BZOJ 2125 最短路

    Description 给一个N个点M条边的连通无向图,满足每条边最多属于一个环,有Q组询问,每次询问两点之间的最短路径. Input 输入的第一行包含三个整数,分别表示N和M和Q 下接M行,每行三个 ...