深入理解JavaScript系列(28):设计模式之工厂模式详解


Posted in Javascript onMarch 03, 2015

介绍

与创建型模式类似,工厂模式创建对象(视为工厂里的产品)时无需指定创建对象的具体类。

工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型。

这个模式十分有用,尤其是创建对象的流程赋值的时候,比如依赖于很多设置文件等。并且,你会经常在程序里看到工厂方法,用于让子类类定义需要创建的对象类型。

正文

下面这个例子中,是应用了工厂方法对第26章构造函数模式代码的改进版本:

var Car = (function () {

    var Car = function (model, year, miles) {

        this.model = model;

        this.year = year;

        this.miles = miles;

    };

    return function (model, year, miles) {

        return new Car(model, year, miles);

    };

})();
var tom = new Car("Tom", 2009, 20000);

var dudu = new Car("Dudu", 2010, 5000);

不好理解的话,我们再给一个例子:

var productManager = {};
productManager.createProductA = function () {

    console.log('ProductA');

}
productManager.createProductB = function () {

    console.log('ProductB');

}

        

productManager.factory = function (typeType) {

    return new productManager[typeType];

}
productManager.factory("createProductA");

如果还不理解的话,那我们就再详细一点咯,假如我们想在网页面里插入一些元素,而这些元素类型不固定,可能是图片,也有可能是连接,甚至可能是文本,根据工厂模式的定义,我们需要定义工厂类和相应的子类,我们先来定义子类的具体实现(也就是子函数):

var page = page || {};

page.dom = page.dom || {};

//子函数1:处理文本

page.dom.Text = function () {

    this.insert = function (where) {

        var txt = document.createTextNode(this.url);

        where.appendChild(txt);

    };

};
//子函数2:处理链接

page.dom.Link = function () {

    this.insert = function (where) {

        var link = document.createElement('a');

        link.href = this.url;

        link.appendChild(document.createTextNode(this.url));

        where.appendChild(link);

    };

};
//子函数3:处理图片

page.dom.Image = function () {

    this.insert = function (where) {

        var im = document.createElement('img');

        im.src = this.url;

        where.appendChild(im);

    };

};

那么我们如何定义工厂处理函数呢?其实很简单:

page.dom.factory = function (type) {

    return new page.dom[type];

}

使用方式如下:
var o = page.dom.factory('Link');

o.url = 'http://www.cnblogs.com';

o.insert(document.body);

至此,工厂模式的介绍相信大家都已经了然于心了,我就不再多叙述了。

总结

什么时候使用工厂模式

以下几种情景下工厂模式特别有用:

1.对象的构建十分复杂
2.需要依赖具体环境创建不同实例
3.处理大量具有相同属性的小对象

什么时候不该用工厂模式

不滥用运用工厂模式,有时候仅仅只是给代码增加了不必要的复杂度,同时使得测试难以运行下去。

Javascript 相关文章推荐
javascript实现的一个带下拉框功能的文本框
May 08 Javascript
window.returnValue使用方法示例介绍
Jul 03 Javascript
使用jQuery将多条数据插入模态框的实现代码
Oct 08 Javascript
javascript实现Table排序的方法
May 15 Javascript
JS+canvas绘制的动态机械表动画效果
Sep 12 Javascript
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
Oct 19 jQuery
微信小程序使用checkbox显示多项选择框功能【附源码下载】
Dec 11 Javascript
vue项目中用cdn优化的方法
Jan 03 Javascript
karma+webpack搭建vue单元测试环境的方法示例
May 24 Javascript
详解Vue中watch对象内属性的方法
Feb 01 Javascript
深入理解vue中的slot与slot-scope
Apr 22 Javascript
node.js文件操作系统实例详解
Nov 05 Javascript
JS运动基础框架实例分析
Mar 03 #Javascript
jQuery DOM插入节点操作指南
Mar 03 #Javascript
JS运动框架之分享侧边栏动画实例
Mar 03 #Javascript
jQuery DOM删除节点操作指南
Mar 03 #Javascript
JS实现表格数据各种搜索功能的方法
Mar 03 #Javascript
深入理解JavaScript系列(27):设计模式之建造者模式详解
Mar 03 #Javascript
javascript验证身份证号
Mar 03 #Javascript
You might like
php使用类继承解决代码重复的问题
2015/02/11 PHP
PHP控制反转(IOC)和依赖注入(DI)
2017/03/13 PHP
Yii框架使用PHPExcel导出Excel文件的方法分析【改进版】
2019/07/24 PHP
Javascript常用运算符(Operators)-javascript基础教程
2007/12/14 Javascript
javascript 字符串连接的性能问题(多浏览器)
2008/11/18 Javascript
JS获取并操作iframe中元素的方法
2013/03/21 Javascript
jQuery获取Radio,CheckBox选择的Value值(示例代码)
2013/12/12 Javascript
jquery $("#variable") 循环改变variable的值示例
2014/02/23 Javascript
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
2014/06/11 Javascript
JavaScript编写推箱子游戏
2015/07/07 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
JavaScript数组的栈方法与队列方法详解
2016/05/26 Javascript
js定时器实例分享
2016/12/20 Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
2017/01/11 Javascript
Angular.js中数组操作的方法教程
2017/07/31 Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
2017/08/17 Javascript
AngularJS中controller控制器继承的使用方法
2017/11/03 Javascript
使用 Vue 绑定单个或多个 Class 名的实例代码
2018/01/08 Javascript
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
前端面试知识点目录一览
2019/04/15 Javascript
Element Cascader 级联选择器的使用示例
2020/07/27 Javascript
python Matplotlib画图之调整字体大小的示例
2017/11/20 Python
Python实现简单遗传算法(SGA)
2018/01/29 Python
pandas对指定列进行填充的方法
2018/04/11 Python
Flask-Mail用法实例分析
2018/07/21 Python
Java语言程序设计测试题选择题部分
2014/04/03 面试题
英语演讲稿范文
2014/01/03 职场文书
应届生自荐信范文
2014/02/21 职场文书
聘用意向书范本
2014/04/01 职场文书
中药学自荐信
2014/06/15 职场文书
亲子阅读的活动方案
2014/08/15 职场文书
2014光棍节大学生联谊活动方案
2014/10/10 职场文书
群众路线自我剖析范文
2014/11/04 职场文书
给女朋友道歉的话大全
2015/01/20 职场文书
中学校园广播稿
2015/08/18 职场文书
Tomcat 与 maven 的安装与使用教程
2022/06/16 Servers