当前位置: 首页 > 编程笔记 >

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

邵兴文
2023-03-14
本文向大家介绍深入理解JavaScript系列(28):设计模式之工厂模式详解,包括了深入理解JavaScript系列(28):设计模式之工厂模式详解的使用技巧和注意事项,需要的朋友参考一下

介绍

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

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

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

正文

下面这个例子中,是应用了工厂方法对第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系列(31):设计模式之代理模式详解,包括了深入理解JavaScript系列(31):设计模式之代理模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 代理,顾名思义就是帮助别人做事,GoF对代理模式的定义如下: 代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问。 代理模式使得代理对象控制具体对象的引用。代理几乎可以是任何对象:文件

  • 本文向大家介绍深入理解JavaScript系列(25):设计模式之单例模式详解,包括了深入理解JavaScript系列(25):设计模式之单例模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 从本章开始,我们会逐步介绍在JavaScript里使用的各种设计模式实现,在这里我不会过多地介绍模式本身的理论,而只会关注实现。OK,正式开始。 在传统开发工程师眼里,单例就是保证一个类只有一个实例,实

  • 本文向大家介绍深入理解JavaScript系列(33):设计模式之策略模式详解,包括了深入理解JavaScript系列(33):设计模式之策略模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 策略模式定义了算法家族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化不会影响到使用算法的客户。 正文 在理解策略模式之前,我们先来一个例子,一般情况下,如果我们要做数据合法性验证,很多时候都

  • 本文向大家介绍深入理解JavaScript系列(44):设计模式之桥接模式详解,包括了深入理解JavaScript系列(44):设计模式之桥接模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 桥接模式(Bridge)将抽象部分与它的实现部分分离,使它们都可以独立地变化。 正文 桥接模式最常用在事件监控上,先看一段代码: 上述代码,有个问题就是getBeerById必须要有浏览器的上下文才能使

  • 本文向大家介绍深入理解JavaScript系列(43):设计模式之状态模式详解,包括了深入理解JavaScript系列(43):设计模式之状态模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 状态模式(State)允许一个对象在其内部状态改变的时候改变它的行为,对象看起来似乎修改了它的类。 正文 举个例子,就比如我们平时在下载东西,通常就会有好几个状态,比如准备状态(ReadyState)、

  • 本文向大家介绍深入理解JavaScript系列(42):设计模式之原型模式详解,包括了深入理解JavaScript系列(42):设计模式之原型模式详解的使用技巧和注意事项,需要的朋友参考一下 介绍 原型模式(prototype)是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象。 正文 对于原型模式,我们可以利用JavaScript特有的原型继承特性去创建对象的方式,也就是创建的一