深入理解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 极速 隐藏/显示万行表格列只需 60毫秒
Mar 28 Javascript
表单验证的完整应用案例探讨
Mar 29 Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
Jun 20 Javascript
JS用斜率判断鼠标进入DIV四个方向的方法
Nov 07 Javascript
使用AngularJS 跨站请求如何解决jsonp请求问题
Jan 16 Javascript
微信小程序 支付功能实现PHP实例详解
May 12 Javascript
PHP实现基于Redis的MessageQueue队列封装操作示例
Feb 02 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
Feb 22 Javascript
jquery实现Ajax请求的几种常见方式总结
May 28 jQuery
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
Aug 20 Javascript
解决vue下载后台传过来的乱码流的问题
Dec 05 Vue.js
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
一个odbc连mssql分页的类
2006/10/09 PHP
遍历指定目录,并存储目录内所有文件属性信息的php代码
2016/10/28 PHP
jQuery仿gmail实现fixed布局的方法
2015/05/27 Javascript
JavaScript实现的简单烟花特效代码
2015/10/20 Javascript
javascript实现简单的全选和反选功能
2016/01/05 Javascript
浅析JavaScript中的变量复制、参数传递和作用域链
2016/01/13 Javascript
详解JavaScript异步编程中jQuery的promise对象的作用
2016/05/03 Javascript
JavaScript继承学习笔记【新手必看】
2016/05/10 Javascript
Bootstrap中的Panel和Table全面解析
2016/06/13 Javascript
深入分析node.js的异步API和其局限性
2016/09/05 Javascript
JS实现json对象数组按对象属性排序操作示例
2018/05/18 Javascript
Vue 实现拖动滑块验证功能(只有css+js没有后台验证步骤)
2018/08/24 Javascript
利用angular自动编译andriod APK的绕坑经历分享
2019/03/08 Javascript
Vue-cli3.x + axios 跨域方案踩坑指北
2019/07/04 Javascript
vue resource发送请求的几种方式
2019/09/30 Javascript
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
bootstrap实现tab选项卡切换
2020/08/09 Javascript
Vue+element+cookie记住密码功能的简单实现方法
2020/09/20 Javascript
vue项目实现减少app.js和vender.js的体积操作
2020/11/12 Javascript
[01:04:31]DOTA2-DPC中国联赛定级赛 iG vs Magma BO3第二场 1月8日
2021/03/11 DOTA
[01:07:15]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第二场 1月25日
2021/03/11 DOTA
django 通过ajax完成邮箱用户注册、激活账号的方法
2018/04/17 Python
Python基于多线程实现抓取数据存入数据库的方法
2018/06/22 Python
python async with和async for的使用
2019/06/20 Python
python pandas写入excel文件的方法示例
2019/06/25 Python
Python图片的横坐标汉字实例
2019/12/04 Python
python matplotlib:plt.scatter() 大小和颜色参数详解
2020/04/14 Python
解决启动django,浏览器显示“服务器拒绝访问”的问题
2020/05/13 Python
keras的backend 设置 tensorflow,theano操作
2020/06/30 Python
南非最大的花卉和送礼服务:NetFlorist
2017/09/13 全球购物
Hunter Boots美国官方网站:赫特威灵顿雨靴
2018/06/16 全球购物
linux面试题参考答案(10)
2016/10/26 面试题
办公室文秘自我评价
2013/09/21 职场文书
淘宝好评语大全
2014/05/05 职场文书
企业环保标语
2014/06/10 职场文书
大学军训通讯稿(2016最新版)
2015/12/21 职场文书