
 工厂模式也是对象创建模式之一,它通常在类或类的静态方法中去实现。构造对象的一种方式是使用new操作符,但使用new时正是针对实现编程,会造成“耦合”问题,与具体的类关系紧密。导致代码更脆弱,缺乏弹性,在复杂逻辑的项目中建议是面向接口编程。 
先看简单工厂模式 
 代码如下: 
Person(name, age) { 
var obj = {} 
obj.name = name 
obj.age = age 
return obj 
} 
var p1 = Person('jack', 25) 
var p2 = Person('lily', 22)  
与构造函数方式写一个类的区别在于没有使用this,而是每次都构造一个空对象,然后给其添加属性。创建对象方式不是使用new,而是使用函数调用方式。这种方式基本上用来替代一个类(具有相同属性的对象),而复杂一些的工厂则可以造不同类型的对象。 
下面以个水果工厂示例 
 代码如下: 
function Banana() { 
this.price = '$1.5' 
} 
function Apple() { 
this.price = '$1.2' 
} 
function Orange() { 
this.price = '$2.2' 
} 
// 静态工厂类 
function Fruit() {} 
Fruit.factory = function(type) { 
if (!window[type]) { 
return 
} 
var fruit = new window[type] 
return fruit 
} 
// 制造不同的水果 
var banana = Fruit.factory('Banana') 
var apple = Fruit.factory('Apple') 
var orange = Fruit.factory('Orange')  
有三个水果类Banana、Apple、Orange,一个水果工厂类Fruit,通过静态方法factory每次可以造出不同的水果类对象。 
工厂模式在JavaScript原生对象Object也有所体现,比如 
 代码如下: 
var obj = Object(), 
num = Object(1), 
str = Object('s'), 
boo = Object(false);  
Object就是一个工厂,根据参数不同会构造出不同的对象。obj是一个空对象,num是一个Number类型的对象,str是一个String类型的对象,boo是Boolean类型的对象。 
jQuery.Callbacks也是一个工厂,每次调用它都会返回一个具有add, remove, fire等方法的对象。还可以根据参数如“once”, “memory”等构造出具有不同性质的对象。 
所谓的工厂模式,是指可以返回一个对象的方法。 
利用这种模式,我们可以做什么呢?假设我不满足现有的DOM对象里面所拥有的方法,我想要增加一个自定义的方法叫sayHello,我们可以这样做: 
 代码如下: 
function RemouldNodeObj(DomNode){ 
//先判断一下传递进来的参数是不是一个Dom节点 
if(typeof DomNode == "object" && DomNode.nodeType == 1){ 
DomNode.say = function(){ 
alert("Hello!!"); 
} 
}else{ 
alert("你传递进来的参数不正确!"); 
} 
} 
//这样调用: 
window.onload = function(){ 
var oDiv = RemouldNodeObj(document.getElementById("test")); 
//通过这一步,oDiv就拥有了新的方法say 
oDiv.say(); 
} 
 
有了上面的基础后,我们来实现点复杂的功能,我们要实现只要通过js的调用就生成一个简单的form表单,看代码: 
 代码如下: 
 
 JavaScript之工厂模式  function RemouldNodeObj(DOMnode){ 
//先判断一下传递进来的参数是不是一个Dom节点 
if(typeof DOMnode == "object" && DOMnode.nodeType == 1){ 
DOMnode.createForm = function(opt){ 
//下面是一大串的字符串加法,只是为了拼装出form元素 
var oForm = ""; 
oForm += ""; 
//这里的this不要想得太复杂,谁调用就指向谁,所以this指向 oDiv 
this.innerHTML = oForm; 
} 
}else{ 
alert("参数不正确!"); 
} 
return DOMnode; 
} 
//这样调用 
window.onload = function(){ 
var oDiv = RemouldNodeObj(document.getElementById("custom")); 
oDiv.createForm({ 
'action' : 'index.jsp', 
'method' : 'post', 
'id' : 'myForm' 
}); 
} 
 script> 
 
 ###    
看到了没?这样的调用方式是不是很像jQuery?如果能够解决跨浏览器问题的话,其实完全可以做出一个搜索栏插件来!