设计模式-如何理解工厂模式?

  1. 设计模式-如何理解工厂模式?
    1. 适用场景
    2. 熟悉的jquery
  2. 总结

设计模式-如何理解工厂模式?

设计模式-如何理解工厂模式?

定义: 创建对象的接口,让子类决定实例化哪个类。工厂方法将类的实例化延迟到子类,而子类可以重写接口方法以便创建的时候指定自己的对象类型。

适用场景

需要根据不同参数产生不同实例,这些实例都有相同的行为,这时候我们可以使用工厂模式,简化实现的过程,同时也可以减少每种对象所需的代码量。工厂模式有利于消除对象间的耦合,提供更大的灵活性

代码理解:

1
2
3
4
5
6
7
8
9
// 下方就是一个典型的工厂模式// 首先创建对象的接口
const productManager = {};
productManager.createProductA = function () {
console.log('ProductA');
}
productManager.createProductB = function () {
console.log('ProductB');
}
productManager.factory = function (type) { // 工厂方法将类的实例化延迟到子类 return new productManager[type];}// 让子类决定实例化哪个类productManager.factory("createProductA");

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
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);
};
};

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

1
2
3
page.dom.factory = function (type) {    
return new page.dom[type];
}

使用方式如下:

1
2
3
var o = page.dom.factory('Link');
o.url = 'http://www.cnblogs.com';
o.insert(document.body);
熟悉的jquery

jQuery中的$()其实就是一个工厂函数,它根据传入参数的不同创建元素或者去寻找上下文中的元素,创建成相应的jQuery对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// https://github.com/jquery/jquery/blob/master/src/core/init.js
init = jQuery.fn.init = function (selector, context, root) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if (!selector) {
return this;
}
// Method init() accepts an alternate rootjQuery
// so migrate can support jQuery.sub (gh-2101)
root = root || rootjQuery;
// Handle HTML strings
if (typeof selector === "string") {
//...
// HANDLE: $(DOMElement)
} else if (selector.nodeType) {
//....
// HANDLE: $(function)
// Shortcut for document ready
} else if (jQuery.isFunction(selector)) {
//....
}
return jQuery.makeArray(selector, this);
};

总结

优点

  • 工厂类含有必要的判断逻辑, 实现了对责任的分割,它提供了专门的工厂类用于创建对象
  • 用户只需要关心所需产品对应的工厂,无须关心创建细节
  • 在系统中加入新产品时,无须修改抽象工厂和抽象产品提供的接口,符合“开闭原则”

缺点

  • 添加新产品时,需要编写新的具体产品类,一定程度上增加了系统的复杂度
  • 考虑到系统的可扩展性,需要引入抽象层,在客户端代码中均使用抽象层进行定义,增加了系统的抽象性和理解难度

×

喜欢就点赞,疼爱就打赏