在读了这章之后,根据我个人现在的理解,工厂模式就是:将一个类或者一个方法称为一个工厂,然后再将一些模块交给这个工厂,让这个工厂按照给它的不同模块产出不同的实例。

下面为正文:
一:简单工厂
例子:
分两部分,第一部分:单车厂(负责产出单车)
var BicycleFactory = {createBicycle: function(model) {var bicycle;switch(model) {case 'The Speedster':bicycle = new Speedster();break;case 'The Lowrider':bicycle = new Lowrider();break;case 'The Flatlander':bicycle = new Flatlander();break;case 'The Comfort Cruiser':default:bicycle = new ComfortCruiser();}Interface.ensureImplements(bicycle, Bicycle);return bicycle;}
};

第二部分:单车店,负责买单车
var BicycleShop = function() {};
BicycleShop.prototype = {sellBicycle: function(model) {var bicycle = BicycleFactory.createBicycle(model);bicycle.assemble();bicycle.wash();return bicycle;}
};

其实很简单,就是讲可分离出来的部分分离出来。
再看一下没有使用简单工厂模式的代码:
var BicycleShop = function() {};
BicycleShop.prototype = {sellBicycle: function(model) {var bicycle;switch(model) {case 'The Speedster':bicycle = new Speedster();break;case 'The Lowrider':bicycle = new Lowrider();break;case 'The Comfort Cruiser':default:bicycle = new ComfortCruiser();}Interface.ensureImplements(bicycle, Bicycle);bicycle.assemble();bicycle.wash();return bicycle;}
};

很明显,就起到解耦的作用了!
二:工厂模式
真正的工厂模式与简单工厂模式的区别在于,它不是另外使用一个类或对象来创建自行车的,而是使用一个子类。
例子:
先创建一个抽象类,里面的createBicycle方法要子类来实现
var BicycleShop = function() {};
BicycleShop.prototype = {sellBicycle: function(model) {var bicycle = this.createBicycle(model);bicycle.assemble();bicycle.wash();return bicycle;},createBicycle: function(model) {throw new Error('Unsupported operation on an abstract class.');}
};

然后子类实现它的createBicycle方法:
var AcmeBicycleShop = function() {};
extend(AcmeBicycleShop, BicycleShop);
AcmeBicycleShop.prototype.createBicycle = function(model) {var bicycle;switch(model) {case 'The Speedster':bicycle = new AcmeSpeedster();break;case 'The Lowrider':bicycle = new AcmeLowrider();break;case 'The Flatlander':bicycle = new AcmeFlatlander();break;case 'The Comfort Cruiser':default:bicycle = new AcmeComfortCruiser();}Interface.ensureImplements(bicycle, Bicycle);return bicycle;
};

另一个子类实现不同的createBicycle方法:
var GeneralProductsBicycleShop = function() {};
extend(GeneralProductsBicycleShop, BicycleShop);
GeneralProductsBicycleShop.prototype.createBicycle = function(model) {var bicycle;switch(model) {case 'The Speedster':bicycle = new GeneralProductsSpeedster();break;case 'The Lowrider':bicycle = new GeneralProductsLowrider();break;case 'The Flatlander':bicycle = new GeneralProductsFlatlander();break;case 'The Comfort Cruiser':default:bicycle = new GeneralProductsComfortCruiser();}Interface.ensureImplements(bicycle, Bicycle);return bicycle;
};

三:工厂模式的适用场合
我还不懂,以后多写代码再总结
 
四:另外一个例子:RSS阅读器
这个例子,有空用来加深理解看看就好了~
/* DisplayModule interface. */var DisplayModule = new Interface('DisplayModule', ['append', 'remove', 'clear']);/* ListDisplay class. */var ListDisplay = function(id, parent) { // implements DisplayModulethis.list = document.createElement('ul');this.list.id = id;parent.appendChild(this.list);
};
ListDisplay.prototype = {append: function(text) {var newEl = document.createElement('li');this.list.appendChild(newEl);newEl.innerHTML = text;return newEl;},remove: function(el) {this.list.removeChild(el);},clear: function() {this.list.innerHTML = '';}
};/* Configuration object. */var conf = {id: 'cnn-top-stories',feedUrl: 'http://rss.cnn.com/rss/cnn_topstories.rss',updateInterval: 60, // In seconds.parent: $('feed-readers')
};/* FeedReader class. */var FeedReader = function(display, xhrHandler, conf) {this.display = display;this.xhrHandler = xhrHandler;this.conf = conf;this.startUpdates();
};
FeedReader.prototype = {fetchFeed: function() {var that = this;var callback = { success: function(text, xml) { that.parseFeed(text, xml); }, failure: function(status) { that.showError(status); } };this.xhrHandler.request('GET', 'feedProxy.php?feed=' + this.conf.feedUrl, callback);},parseFeed: function(responseText, responseXML) {this.display.clear();var items = responseXML.getElementsByTagName('item');for(var i = 0, len = items.length; i < len; i++) {var title = items[i].getElementsByTagName('title')[0];var link = items[i].getElementsByTagName('link')[0];this.display.append('<a href="' + link.firstChild.data + '">' + title.firstChild.data + '</a>');}},showError: function(statusCode) {this.display.clear();this.display.append('Error fetching feed.');},stopUpdates: function() {clearInterval(this.interval);},startUpdates: function() {this.fetchFeed();var that = this;this.interval = setInterval(function() { that.fetchFeed(); }, this.conf.updateInterval * 1000);}
};/* FeedManager namespace. */var FeedManager = {createFeedReader: function(conf) {var displayModule = new ListDisplay(conf.id + '-display', conf.parent);Interface.ensureImplements(displayModule, DisplayModule);var xhrHandler = XhrManager.createXhrHandler();Interface.ensureImplements(xhrHandler, AjaxHandler);return new FeedReader(displayModule, xhrHandler, conf);}
};

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

转载于:https://www.cnblogs.com/oadaM92/p/4367426.html

《javascript设计模式》笔记之第七章:工厂模式相关推荐

  1. 【设计模式2022】第四章 工厂模式

    [设计模式2022]第四章 工厂模式 文章目录 [设计模式2022]第四章 工厂模式 一.概述 二.简单工厂模式 1.结构 2.实现 3.分析 4.扩展 三.工厂方法模式 1.结构 2.实现 3.分析 ...

  2. 【JavaScript设计模式张容铭】抽象工厂模式深度剖析——关于继承与constructor属性的深度理解

    写在前面 最近阅读了张容铭的<JavaScript设计模式>一书,阅读到抽象工厂模式一节时对书上的代码产生了疑问,但同时在解决疑问的过程中,对继承又产生了新的理解. 我仔细查阅了很多文章, ...

  3. JavaScript 设计模式学习第九篇- 抽象工厂模式

    工厂模式 (Factory Pattern),根据输入的不同返回不同类的实例,一般用来创建同一类对象.工厂方式的主要思想是将对象的创建与对象的实现分离. 抽象工厂 (Abstract Factory) ...

  4. Java设计模式笔记(3)抽象工厂模式

    抽象工厂模式:为创建一组相关的或者相互依赖的对象提供一个接口,而且无需指定他们的具体类. 抽象工厂模式是工厂方法模式的升级版本,在有多个业务品种.业务分类时,通过抽象工厂模式产生需要的对象是一种非常好 ...

  5. [转]《精通Javascript》笔记:第六章(事件)

    <精通Javascript>笔记:第六章(事件) Published by sansan at 11:41 am under 前端|Front-End 事件模型:捕获和冒泡 通过oneve ...

  6. PMBOK(第六版) 学习笔记 ——《第七章 项目成本管理》

    系列文章目录 PMBOK(第六版) 学习笔记 --<第一章 引论> PMBOK(第六版) 学习笔记 --<第二章 项目运行环境> PMBOK(第六版) 学习笔记 --<第 ...

  7. 【PaddleSpeech-学习笔记】第七章:声音合成

    [PaddleSpeech-学习笔记]第七章:声音合成 人类通过听觉获取的信息大概占所有感知信息的20%~30%. 声音储存了丰富的语义与时序信息,由专门负责听觉的器官接收信号,产生一系列连锁刺激后, ...

  8. 李弘毅机器学习笔记:第七章—深度学习的发展趋势

    李弘毅机器学习笔记:第七章-深度学习的发展趋势 回顾一下deep learning的历史: 1958: Perceptron (linear model) 1969: Perceptron has l ...

  9. javascript学习笔记(第四章图片库--初步了解)

    javascript学习笔记(第四章图片库–初步了解) 通过前三章的学习我们已经对这个新的语言有了一个了解,js的语法基本和C语言一致,我们可以通过调用一些document对象中的函数来对实现一些很简 ...

  10. 【设计模式】第四章 工厂模式

    第四章 工厂模式 文章目录 第四章 工厂模式 一.介绍 二.简单工厂模式 三.工厂方法模式 四.抽象工厂模式 一.介绍 工厂模式(Factory Pattern),工厂就是创建产品的地方,根据创建的产 ...

最新文章

  1. 去掉字符串两端的全角空格和半角空格(含源代码)
  2. ChannelFactory创建和销毁昂贵
  3. (56)等待链表,调度链表
  4. 前后端分离之JWT用户认证
  5. 关于秒杀系统优化方向
  6. 【Vue 3.0 新特性(四)】Vue 3.0 响应式系统原理
  7. oracle中@,深入理解Oracle中的DBCA
  8. linux系统中删除一次性任务流程,Linux系统中的计划任务
  9. c 本地html解析,使用selenium解析本地HTML文件方法
  10. python pop函数 索引_[python] 字典和列表中的pop()函数
  11. 微软云 mysql 重启_停止Azure MySQL PaaS数据库
  12. Python3 列表
  13. java实现萤石云截图保存上传到ftp功能
  14. antd-select拼音首字母模糊查询
  15. 【愚公系列】2022年09月 微信小程序-自定义tabBar的实现
  16. android通知小图标灰色,android – 大型通知图标旁边的灰色圆圈?
  17. 如何关闭coreldraw x4检测弹出非法软件您的产品已被禁用怎么办?
  18. linux命令行怎么结束进程,linux结束进程命令
  19. python arcade库_python游戏库:Arcade教程(4)
  20. 饶毅:我为什么用了九年才获得博士学位?

热门文章

  1. 网站优化中受欢迎的文章是怎样的?
  2. 网站站外优化工作这四项比较“突出”
  3. vs mysql搭建_VS+mysql+EF搭建
  4. java 所有的数据集合_第五节:Java中常用数据集合
  5. android隐藏状态栏
  6. spark-submit python egg 解决三方件依赖问题
  7. RCNN 目标识别基本原理
  8. ES6中定义的类和对象
  9. SQL UNION 操作符
  10. jboss中控制台jmx-console 登录的用户名和密码设置