简单工厂模式是由一个方法来决定到底要创建哪个类的实例, 而这些实例经常都拥有相同的接口. 这种模式主要用在所实例化的类型在编译期并不能确定， 而是在执行期决定的情况。 说的通俗点，就像公司茶水间的饮料机，要咖啡还是牛奶取决于你按哪个按钮。
简单工厂模式在创建 ajax 对象的时候也非常有用.
之前我写了一个处理 ajax 异步嵌套的库，地址在 https://github.com/AlloyTeam/DanceRequest
这个库里提供了几种 ajax 请求的方式，包括 xhr 对象的 get, post, 也包括跨域用的 jsonp 和 iframe. 为了方便使用, 这几种方式都抽象到了同一个接口里面.
|
1 2 3 4 5 6 7 8 9 10 11 |
var request1 = Request('cgi.xx.com/xxx' , ''get' ); request1.start(); request1.done( fn ); var request2 = Request('cgi.xx.com/xxx' , ''jsonp' ); request2.start(); request2.done( fn ); |
Request 实际上就是一个工厂方法, 至于到底是产生 xhr 的实例, 还是 jsonp 的实例. 是由后来的代码决定的。
实际上在 js 里面，所谓的构造函数也是一个简单工厂。只是批了一件 new 的衣服. 我们扒掉这件衣服看看里面。
通过这段代码, 在 firefox, chrome 等浏览器里，可以完美模拟 new.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
function A( name ){ this.name = name; } function ObjectFactory(){ var obj = {}, Constructor = Array.prototype.shift.call( arguments ); obj.__proto__ = typeof Constructor .prototype === 'number' ? Object.prototype : Constructor .prototype; var ret = Constructor.apply( obj, arguments ); return typeof ret === 'object' ? ret : obj; } var a = ObjectFactory( A, 'svenzeng' ); alert ( a.name ); //svenzeng |
这段代码来自 es5 的 new 和构造器的相关说明， 可以看到，所谓的 new， 本身只是一个对象的复制和改写过程， 而具体会生成什么是由调用 ObjectFactory 时传进去的参数所决定的。
思召 2017 年 6 月 20 日
提供的代码实现略显复杂，提供一个简单的实现：
function factory(){
var inst, ret,
Constructor = Array.prototype.shift.call(arguments);
}
kael 2017 年 2 月 18 日
return typeof ret === ‘object’ ? ret : obj; 这块是否漏了对 function 类型的判断？应该是这样：return typeof ret === ‘object’ || typeof ret === ‘function’ ? ret : obj;
无 2016 年 8 月 30 日
var ret = Constructor.apply( obj, arguments );ret 什么情况下是 object 类型
Hanfei 2015 年 6 月 10 日
这么做 a 的 prototype 是 Obj，不是 A
silen 2015 年 5 月 25 日
还有个疑问：为什么评论会过滤 ”
刚才评论的码本应该是 ‘function Fun(){};o=new Fun() (o={},Fun.call(o),o.constructor=Fun)’
silen 2015 年 5 月 25 日
function Fun(){};o=new Fun() (o={},Fun.call(o),o.constructor=Fun)
silen 2015 年 5 月 25 日
**自己写原型写成这样的时候把 A.prototype = 1**
-> 例子中的 A 不是构造函数么，构造函数为什么要写成 A.prototype = 1？
其实直接就是这样也可以了吧：
function Fun(){};o=new Fun() (o={},Fun.call(o),o.constructor=Fun)
jozhi 2015 年 5 月 12 日
又看了一遍， 感念还是不理解。
yp 2013 年 9 月 3 日
DanceRequest.js 有没有如何调用函数的说明文档啊
Mato 2013 年 8 月 25 日
typeof Constructor.prototype === ‘number’ ? Object.prototype : Constructor .prototype;
中的
typeof Constructor.prototype === ‘number’
哪种情况会出现？
svenzeng 2013 年 9 月 27 日
自己写原型写成这样的时候把 A.prototype = 1
she 2017 年 6 月 19 日
请问一下～～如果其他人自己写原型写成 A.prototype = “1111” 这样子怎么办
巴格罗 2012 年 11 月 20 日
能简单讲讲那个构造函数为什么那么写么，查了半天看懂了几个内置函数，但是为什么那么绕不理解呀。
svenzeng 2012 年 11 月 22 日
标准规范是这样规定的，没有什么太具体的原因。
VVG 2012 年 10 月 25 日
github 404 了
【Javascript设计模式16】- 享元模式 | Tencent AlloyTeam 2012 年 10 月 25 日
[…] 简单工厂模式 […]
【Javascript设计模式17】- 状态模式 | Tencent AlloyTeam 2012 年 10 月 25 日
[…] 简单工厂模式 […]
【Javascript设计模式4】- 适配器模式 | Tencent AlloyTeam 2012 年 10 月 24 日
[…] 简单工厂模式： http://www.alloyteam.com/2012/10/commonly-javascript-design-patterns-simple-fa… […]
【javascript设计模式12】-迭代器模式 | Tencent AlloyTeam 2012 年 10 月 24 日
[…] 简单工厂模式： http://www.alloyteam.com/2012/10/commonly-javascript-design-patterns-simple-fa… […]
【javascript设计模式3】-观察者模式 | Tencent AlloyTeam 2012 年 10 月 24 日
[…] 简单工厂模式： http://www.alloyteam.com/2012/10/commonly-javascript-design-patterns-simple-fa… […]
【javascript设计模式1】-单例模式 | Tencent AlloyTeam 2012 年 10 月 24 日
[…] 简单工厂模式： http://www.alloyteam.com/2012/10/commonly-javascript-design-patterns-simple-fa… […]