js常见的设计模式

118 阅读4分钟

1.工厂模式(Factory Pattern):通过工厂方法创建对象,可以隐藏创建对象的复杂度,使代码更加灵

活。

2.单例模式(Singleton Pattern):保证一个类仅有一个实例,并提供一个全局访问点。

3.观察者模式(Observer Pattern):定义了一种一对多的依赖关系,当一个对象的状态发生改变时,所有

依赖它的对象都会得到通知并自动更新。

4.发布-订阅模式(Publish-Subscribe Pattern):与观察者模式类似,但是它将观察者和被观察者解

耦,通过消息中心来传递消息。

5.装饰器模式(Decorator Pattern):动态地给一个对象添加一些额外的职责,就增加功能来说,装饰器

模式比生成子类更为灵活。

6.命令模式(Command Pattern):将请求封装成一个对象,使得可以用不同的请求来参数化对象,将请求

排队或记录请求日志,以及支持可撤销的操作。

7.策略模式(Strategy Pattern):定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替

换。

8.组合模式(Composite Pattern):将对象组合成树形结构以表示“部分-整体”的层次结构,使得用户对

单个对象和组合对象的使用具有一致性。

9.桥接模式(Bridge Pattern):将抽象部分与它的实现部分分离,使它们都可以独立地变化。

10.适配器模式(Adapter Pattern):将一个类的接口转换成客户希望的另外一个接口,使得原本由于接口

不兼容而不能一起工作的那些类可以一起工作。

详细介绍

工厂模式(Factory Pattern)

工厂模式是一种创建型设计模式,它提供了一种创建对象的最佳方式。在工厂模式中,我们不必指定要创建的

具体类,而是使用工厂方法来创建对象,并将创建对象的复杂度隐藏在工厂方法中。这使得代码更加灵活,因

为我们可以随时更改工厂方法来创建不同类型的对象,而不必更改客户端代码。

举个例子,我们可以创建一个Animal工厂来创建不同类型的动物:

`function AnimalFactory() {}

AnimalFactory.prototype.createAnimal = function(type) {

var animal;

if (type === 'dog') {

animal = new Dog();

} else if (type === 'cat') {

animal = new Cat();

}

return animal;

};`

在这个例子中,AnimalFactory是一个工厂类,它有一个createAnimal方法,用于创建不同类型的动物。 当客户端需要创建一个动物时,只需要调用createAnimal方法并传递动物的类型即可。

单例模式(Singleton Pattern) 单例模式是一种创建型设计模式,它保证一个类仅有一个实例,并提供一个全局访问点。在JavaScript中, 我们可以使用闭包来实现单例模式。 举个例子,我们可以创建一个Logger单例来记录日志:

`var Logger = (function() {

var instance;

function Logger() {

if (instance) {

return instance;

}instance = this;

this.logs = [];

}

Logger.prototype.log = function(message) {

this.logs.push(message);

console.log(message);

};

return Logger;

})();`

在这个例子中,Logger是一个单例类,它在内部使用闭包来保证只有一个实例。当客户端需要创建一个 Logger实例时,只需要调用Logger构造函数即可。

观察者模式(Observer Pattern)

观察者模式是一种行为型设计模式,它定义了一种一对多的依赖关系,当一个对象的状态发生改变时,所有依 赖它的对象都会得到通知并自动更新。在JavaScript中,我们可以使用事件来实现观察者模式。 举个例子,我们可以创建一个Subject类来管理所有的观察者,并在状态改变时通知它们: `function Subject() {

this.observers = [];

}

Subject.prototype.addObserver = function(observer) {

this.observers.push(observer);

};

Subject.prototype.removeObserver = function(observer) {

var index = this.observers.indexOf(observer);

if (index > -1) {

this.observers.splice(index, 1);

}

};

Subject.prototype.notify = function(message) {

for (var i = 0; i < this.observers.length; i++) {

this.observers[i].update(message);

}

}; ` 在这个例子中,Subject是一个主题类,它有一个observers数组来存储所有的观察者。当状态改变时, Subject会遍历所有的观察者,并调用它们的update方法来通知它们。

发布-订阅模式(Publish-Subscribe Pattern) 发布-订阅模式是一种行为型设计模式,它将观察者和被观察者解耦,通过消息中心来传递消息。在 JavaScript中,我们可以使用事件来实现发布-订阅模式。 举个例子,我们可以创建一个EventEmitter类来管理所有的事件,并在事件触发时通知所有的订阅者:

`function EventEmitter() {

this.events = {};

}

EventEmitter.prototype.on = function(event, listener) {

if (!this.events[event]) {

this.events[event] = [];

}

this.events[event].push(listener);

};

EventEmitter.prototype.emit = function(event, data) {

if (!this.events[event]) {

return;

}

this.events[event].forEach(function(listener) {18.执行上线文和执行栈

listener(data);

});

};`

在这个例子中,EventEmitter是一个事件管理器,它有一个events对象来存储所有的事件。当事件触发

时,EventEmitter会遍历所有的订阅者,并调用它们的回调函数来通知它们。