JS之工厂模式

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS之工厂模式相关的知识,希望对你有一定的参考价值。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>工厂模式</title>
 6 </head>
 7 <body>
 8 <script>
 9 //让我们决定通过厂长告诉做什么事情,不需了解内部
10 /*模式作用:
11       1,对象的构建十分复杂,可以用此模式
12       2,需要依赖具体的环境创建不同的实例
13       3,处理大量具有相同属性的小对象。
14   注意事项:
15         1,不能滥用工厂,有时候是增加代码增加复杂度
16         2,
17 
18 */
19 </script>
20 <script>
21     /* 实例一个简单工厂
22     工厂应该有产长来决定运行哪些产品线
23     消费者 =》子类
24 
25     */
26     //gongchang 是一个单例牧师
27     var gongchang = {};
28     gongchang.chanyifu =function(){
29         this.gongren = 50;
30 //        alert(‘我们有工人数‘+this.gongren);
31     }
32     gongchang.chanxie = function(){
33         alert(产鞋子)
34     }
35     gongchang.yunshu = function () {
36         alert(运输)
37     }
38     gongchang.changzhang = function (para) {
39       //new JS 构造函数模式 单例模式
40         return new gongchang[para]();
41     }
42     var me = gongchang.changzhang(chanyifu);
43     alert(me.gongren);
44 </script>
45 <script>
46  /*简单工厂 ajax*/
47  //单例,XMLHttpFactory一个简单工厂
48     var XMLHttpFactory = function(){};
49  //工厂里有createXMLHttp()方法 根据当前环境的具体情况返回一个XHR对象
50     XMLHttpFactory.createXMLHttp = function(){
51         var XMLHttp = null;
52         if (window.XMLHttpRequest){
53             XMLHttp = new XMLHttpRequest();
54         }
55         else if(window.ActiveXObject){
56             XMLHttp = new ActiveXObject(Microsoft.XMLHTTP)
57         }
58         return XMLHttp;
59     };
60     var AjaxHander = function(){
61         //最后生产到 我拿到的对象 不用管工厂里做了什么事,
62         var XMLHttp = XMLHttpFactory.createXMLHttp();
63         //具体操作
64     }
65 </script>
66 <script>
67     /*以下是抽象复杂工厂*/
68     var XMLHttpFactory = function(){};
69     XMLHttpFactory.prototype = {
70         //调用这个的话 跑出一个错误,不能被实例化,只能用来派生子类 让别的子类来继承自己,然后做他们自己的事情
71         createFactory:function(){
72             throw new Error(这是一错误)
73         }
74     };
75     var XHRHander = function(){
76         XMLHttpFactory.call(this);
77     };
78     //将XMLHttpFactory的继承到XHRHander
79     XHRHander.prototype = new XMLHttpFactory();
80     //重新定义createFactory方法
81     XHRHander.prototype.constructor = XHRHander;
82 
83     XHRHander.prototype.createFactory = function () {
84         var XMLHttp = null;
85         if (window.XMLHttpRequest){
86             XMLHttp = new XMLHttpRequest()
87         }
88         else if(window.ActiveXObject){
89             XMLHttp = new ActiveXObject(Microsoft.XMLHTTP)
90         }
91         return XMLHttp;
92     }
93 
94 </script>
95 </body>
96 </html>

 

以上是关于JS之工厂模式的主要内容,如果未能解决你的问题,请参考以下文章

js面向对象程序设计之构造函数

JS设计模式之工厂模式

js之简单工厂模式

JS之工厂模式

设计模式之单例模式

JS设计模式——工厂模式详解