工厂模式:可以把所有实例化的代码都集中在一个位置。将new关键字放到一个外部对象中,即放到工厂中间去,这样在创建对象的时候,只要调用这个工厂函数,而不用使用new来执行,其实就是把new交给工厂函数来执行。
1. 对象的构建十分复杂
2. 需要依赖具体环境创建不同实例
3. 处理大量具有相同属性的对象
例如:实例化后返回三个属性和一个方法,可以解决创建多个相似对象的问题:工厂中返回的是实例化好的对象!
1 function Person(name,age,job){ 2 var o = new Object(); 3 o.name = name; 4 o.age = age; 5 o.job = job; 6 o.sayName = function(){ 7 alert(this.name); 8 } 9 return o; 10 } 11 12 var person1 = Person("free",29,"doctor");
简单工厂函数实现:将实例化的工作交个XMLHttpFactory.createXMLHttp()来实现。
1 var XMLHttpFactory =function(){}; //这是一个简单工厂模式
2 XMLHttpFactory.createXMLHttp =function(){
3 var XMLHttp = null;
4 if (window.XMLHttpRequest){
5 XMLHttp = new XMLHttpRequest()
6 }elseif (window.ActiveXObject){
7 XMLHttp = new ActiveXObject("Microsoft.XMLHTTP")
8 }
10 return XMLHttp;
11 }
12 //XMLHttpFactory.createXMLHttp()这个方法根据当前环境的具体情况返回一个XHR对象。
13 var AjaxHander =function(){
14 var XMLHttp = XMLHttpFactory.createXMLHttp();
15 ...
16 }
抽象工厂模式:
1.创建抽象工厂函数
2.建立它的子类,继承了它的属性和方法
3.在子类中建立工厂使用new建立工厂方法
例:
1 var XMLHttpFactory =function(){}; //这是一个抽象工厂模式
2 XMLHttpFactory.prototype = {
3 //如果真的要调用这个方法会抛出一个错误,它不能被实例化,只能用来派生子类
4 createFactory:function(){
5 thrownew Error('This is an abstract class');
6 }
7 }
8 //派生子类,文章开始处有基础介绍那有讲解继承的模式,不明白可以去参考原理
9 var XHRHandler =function(){
10 XMLHttpFactory.call(this);
11 };
12 XHRHandler.prototype =new XMLHttpFactory();
13 XHRHandler.prototype.constructor = XHRHandler;
14 //重新定义createFactory 方法
15 XHRHandler.prototype.createFactory =function(){
16 var XMLHttp =null;
17 if (window.XMLHttpRequest){
18 XMLHttp =new XMLHttpRequest()
19 }elseif (window.ActiveXObject){
20 XMLHttp =new ActiveXObject("Microsoft.XMLHTTP")
21 }
22 return XMLHttp;
23 }
Ajax请求任务:
1 //implements AjaxHandler,创建一个复杂的工厂来执行Ajax的一系列流程,里面包含了两个简单工厂
2 var SimpleHandler = function(){};
3
4 SimpleHandler.prototype = {
5 //第一个简单工厂执行Ajax的创建,请求,发送。。。等
6 request:function(method,url,callback,postVars){
7 var xhr = this.createXhrObject();
8 xhr.onreadystatechange = function(){
9 if(xhr.readyState != 4) return;
10 (xhr.status == 200) ?
11 //定义了一个全局对象callback来执行对返回参数的应用
12 callback.success(xhr.responseText,xhr.responseXML):
13 callback.failure(xhr.status);
14 };
15 xhr.open(method,url,true);
16 if(method != "POST") postVars = null;
17 xhr.send(postVars);
18 },
19 //第二个简单工厂是根据不同的情创建XHR对象,不论什么情况他都能返回一个正确的XHR对象
20 createXhrObject:function(){
21 var methods = [
22 function(){return new XMLHttpRequest();},
23 function(){return new ActiveXObject('Msxml2.XMLHttp');},
24 function(){return new ActiveXObject('Microsoft.XMLHttp');}
25 ];
26 for(var i = 0; i < 3; i++){
27 try{
28 methods[i]();
29 }catch(e){
30 continue;
31 }
32 this.createXhrObject = methods[i]();
33 return methods[i]();
34 }
35 throw new Error("Error!");
36 }
37 }
38
2 var SimpleHandler = function(){};
3
4 SimpleHandler.prototype = {
5 //第一个简单工厂执行Ajax的创建,请求,发送。。。等
6 request:function(method,url,callback,postVars){
7 var xhr = this.createXhrObject();
8 xhr.onreadystatechange = function(){
9 if(xhr.readyState != 4) return;
10 (xhr.status == 200) ?
11 //定义了一个全局对象callback来执行对返回参数的应用
12 callback.success(xhr.responseText,xhr.responseXML):
13 callback.failure(xhr.status);
14 };
15 xhr.open(method,url,true);
16 if(method != "POST") postVars = null;
17 xhr.send(postVars);
18 },
19 //第二个简单工厂是根据不同的情创建XHR对象,不论什么情况他都能返回一个正确的XHR对象
20 createXhrObject:function(){
21 var methods = [
22 function(){return new XMLHttpRequest();},
23 function(){return new ActiveXObject('Msxml2.XMLHttp');},
24 function(){return new ActiveXObject('Microsoft.XMLHttp');}
25 ];
26 for(var i = 0; i < 3; i++){
27 try{
28 methods[i]();
29 }catch(e){
30 continue;
31 }
32 this.createXhrObject = methods[i]();
33 return methods[i]();
34 }
35 throw new Error("Error!");
36 }
37 }
38