javascript设计模式-抽象工厂模式

  1 <!doctype html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>抽线工厂</title>
  6 </head>
  7 <body>
  8
  9 <script>
 10 /**
 11  * 抽象工厂模式
 12  *
 13  * 定义： 提供一个创建一系列相关或相互依赖对象的接口，而无需制定它们具体的类。
 14  *
 15  * 本质：
 16  * 选择产品簇的实现。
 17  *
 18  * 功能：
 19  * 为一系列相关对象或相互依赖的对象创建一个接口。这个接口内的方法不是任意堆砌的，而是一系列相关或相互依赖的方法。
 20  * 从某种意义上看，抽象工厂其实是一个产品系列，或者是产品簇。
 21  *
 22  * 使用工厂方法来实现抽象工厂。
 23  *
 24  * 工厂方法是选择单个产品的实现，虽然一个类里面可以有多个工厂方法，但是这些方法之间一般是没有联系的，即使看起来像有联系。
 25  * 但是抽象工厂着重的就是为一个产品簇选择实现，定义在抽象工厂里面的方法通常是由联系的，它们都是产品的某一部分或者是相互依赖的。如果抽象工厂里面只定义一个方法，直接创建产品，那么就退化成为工厂方法。
 26  *
 27  * 何时使用？
 28  * 1.如果希望一个系统独立于它的产品的创建，组合和表示的时候。也就是一个系统只是知道产品的接口，而不关心实现的时候、
 29  * 2.如果一个系统要由多个产品系列中的一个来配置的时候。也就是可以动态地切换产品簇的时候。
 30  * 3.如果要强调一系列相关产品的接口，以便联合使用它们的时候。
 31  *
 32  * 优点：
 33  * 分离接口和实现
 34  * 使得切换产品簇变得容易
 35  *
 36  * 缺点：
 37  * 不太容易扩展新产品
 38  * 容易造成雷层次复杂
 39  *
 40  * 抽象工厂模式和单例模式
 41  * 这两个模式可以组合使用。
 42  * 在抽象工厂模式里面，具体的工厂实现，在整个应用中，通常一个产品系列只需要一个实例就可以了，因此可以把具体的工厂实现成为单例。
 43  *
 44  */
 45 // 示例代码：
 46 /**
 47  * 抽象工厂的接口，声明创建抽象产品对象的操作
 48  */
 49 var AbstractFactory = function () {};
 50 AbstractFactory.prototype = {
 51     /**
 52      * 示例方法，创建抽象产品A的对象
 53      * @return {[type]} 抽象产品A的对象
 54      */
 55     createProductA: function () {},
 56     // 创建抽象产品B
 57     createProductB: function () {}
 58 };
 59
 60 /**
 61  * 抽象产品A,B的接口
 62  */
 63 var AbstractProductA = function () {};
 64 // ...
 65 var AbstractProductB = function () {};
 66 // ...
 67
 68 // 产品A的实现
 69 var ProductA1 = function () {};
 70 ProductA1.prototype = Object.create(AbstractProductA.prototype);
 71 // ...
 72
 73 var ProductA2 = function () {};
 74 ProductA2.prototype = Object.create(AbstractProductA.prototype);
 75 // ...
 76
 77 // 产品B的实现
 78 var ProductB1 = function () {};
 79 ProductB1.prototype = Object.create(AbstractProductB.prototype);
 80 // ...
 81
 82 var ProductB2 = function () {};
 83 ProductB2.prototype = Object.create(AbstractProductB.prototype);
 84 // ...
 85
 86 /**
 87  * 具体的工厂实现对象，实现创建具体的产品对象的操作
 88  */
 89 var ConcretFactory1 = function () {};
 90 ConcretFactory1.prototype = Object.create(AbstractFactory.prototype);
 91 ConcretFactory1.prototype.createProductA = function () {
 92     return new ProductA1();
 93 };
 94 ConcretFactory1.prototype.createProductB = function () {
 95     return new ProductB1();
 96 };
 97
 98 var ConcretFactory2 = function () {};
 99 ConcretFactory2.prototype = Object.create(AbstractFactory.prototype);
100 ConcretFactory2.prototype.createProductA = function () {
101     return new ProductA2();
102 };
103 ConcretFactory2.prototype.createProductB = function () {
104     return new ProductB2();
105 };
106
107 // 客户端
108 var af = new ConcretFactory1();
109 af.createProductA();
110 af.createProductB();
111
112
113 // 示例2
114 var AMDCPU = function (id) {
115     this.id = id;
116 };
117 var MSIMainboard = function (id) {
118     this.id = id;
119 };
120
121 var Schema1 = function () {};
122 Schema1.prototype = {
123     createCPUApi: function () {
124         return new AMDCPU(939);
125     },
126     createMainboardApi: function () {
127         return new MSIMainboard(939);
128     }
129 };
130
131 var Schema2 = function () {};
132 Schema2 = {
133     createCPUApi: function () {
134         return new AMDCPU(1000);
135     },
136     createMainboardApi: function () {
137         return new MSIMainboard(1000);
138     }
139 };
140
141 var ComputerEngineer = (function () {
142     var cpu;
143     var mainboard;
144
145     function prepareHardWare(schema) {
146         cpu = schema.createCPUApi();
147         mainboard = schema.createMainboardApi();
148         console.log('prepared');
149     }
150
151     var ComputerEngineer = function () {
152         cpu = null;
153         mainboard = null;
154     };
155     ComputerEngineer.prototype = {
156         makeComputer: function (schema) {
157             prepareHardWare(schema);
158         }
159     };
160
161     return ComputerEngineer;
162 }());
163
164 var engineer = new ComputerEngineer();
165 var schema = new Schema1();
166 engineer.makeComputer(schema);
167 engineer = schema = null;
168
169
170 // http://www.dofactory.com/javascript-abstract-factory-pattern.aspx
171
172 function Employee(name) {
173     this.name = name;
174     this.say = function () {
175         log.add("I am employee " + name);
176     };
177 }
178
179 function EmployeeFactory() {
180     this.create = function (name) {
181         return new Employee(name);
182     };
183 }
184
185 function Vendor(name) {
186     this.name = name;
187     this.say = function () {
188         log.add("I am vendor " + name);
189     };
190 }
191
192 function VendorFactory() {
193     this.create = function (name) {
194         return new Vendor(name);
195     };
196 }
197
198 // log helper
199 var log = (function () {
200     var log = "";
201     return {
202         add: function (msg) { log += msg + "\n"; },
203         show: function () {
204             alert(log);
205             log = "";
206         }
207     }
208 })();
209
210
211 function run() {
212
213     var persons = [];
214
215     var employeeFactory = new EmployeeFactory();
216     var vendorFactory = new VendorFactory();
217
218     persons.push(employeeFactory.create("Joan DiSilva"));
219     persons.push(employeeFactory.create("Tim O'Neill"));
220
221     persons.push(vendorFactory.create("Gerald Watson"));
222     persons.push(vendorFactory.create("Nicole McNight"));
223
224     for (var i = 0, len = persons.length; i < len; i++) {
225         persons[i].say();
226     }
227
228     log.show();
229 }
230 </script>
231 </body>
232 </html>

转载于:https://www.cnblogs.com/webFrontDev/p/3553373.html

javascript设计模式-抽象工厂模式相关推荐

JavaScript设计模式———抽象工厂模式
定义: 抽象工厂其实是实现子类继承父类的方法,只是一个方法.抽象工厂模式一般用在多人协作的超大型项目中,并且严格的要求项目以面向对象的思想进行完成. 简单工厂模式和工厂模式都是直接生产实例的,抽象工厂 ...
JavaScript设计模式 - 抽象工厂模式
抽象工厂模式这也是针对工厂模式无法应对多对象多复杂对象而出的一种模式,抽象工厂模式并不是直接生成实例,而是对于产品的一个分类的创建 class User {constructor(name, rol ...
javascript设计模式--抽象工厂模式
抽象工厂模式(abstract Fctory):通过对类的工厂抽象使其业务用于对产品类鏃的创建,而不负责创建某一类产品的实例． //汽车抽象类,当使用其实例对象的方法时会抛出错误var Car = f ...
JavaScript设计模式--简单工厂模式例子---XHR工厂
JavaScript设计模式--简单工厂模式例子---XHR工厂第一步,Ajax操作接口(目的是起一个接口检测作用) (1)引入接口文件 //定义一个静态方法来实现接口与实现类的直接检验 //静态方 ...
系统架构技能之设计模式-抽象工厂模式
一.上篇回顾上篇我们主要讲述了简单工厂模式和工厂模式.并且分析了每种模式的应用场景和一些优缺点,我们现在来回顾一下: 简单工厂模式:一个工厂负责所有类型对象的创建,不支持无缝的新增新的类型对象的创建 ...
常见设计模式—抽象工厂模式
设计模式-抽象工厂模式 1.什么是抽象工厂模式抽象工厂模式是围绕一个超级工厂创建其它工厂,是工厂方法模式的升级版本,工厂方法模式只生产一个等级的产品,而抽象工厂模式可生产多个等级的产品. 2.角色分 ...
【JAVA进阶系列】JAVA 设计模式 -- 抽象工厂模式(Abstract Factory)
[JAVA进阶系列]JAVA 设计模式 -- 抽象工厂模式(Abstract Factory) [1.1]抽象工厂模式简介抽象工厂者模式的类结构图 AbstractProduct(抽象产品),Abs ...
JavaScript高级进阶之设计模式抽象工厂模式
抽象工厂模式负责同一类的产品,但是不对负责某一个产品的实例,实例的任务交给创建某个产品的方法 /*** @param {Object} fun 需要抽象的方法体函数* @param {Object ...
java设计模式---抽象工厂模式
工厂模式在项目中是常常用到的,有人说只有大项目才会用到,小项目是体会不出来.其实使用设计模式与项目的大小没有实质性的联系.设计模式是经验的总结而不是衡量项目大小的标准. 以开发项目的DAO层为例,在项 ...

javascript设计模式-抽象工厂模式

javascript设计模式-抽象工厂模式相关推荐

最新文章

热门文章