观察者模式
当对象之间存在一对多的依赖关系时,其中一个对象的状态发生改变,所有依赖它的对象都会收到通知,这就是观察者模式。
在观察者模式中,只有两种主体:目标对象 (Subject
) 和 观察者 (Observer
)。
-
目标对象
Subject
:- 维护观察者列表
observerList
———— 维护拥有订阅权限的用户列表 - 定义添加观察者的方法 ———— 提供用户订阅权限的功能
- 当自身发生变化后,通过调用自己的
notify
方法依次通知每个观察者执行update
方法 ———— 发布对应任务后通知有订阅权限的用户
- 维护观察者列表
-
观察者
Observer
需要实现update
方法,供目标对象调用。update
方法中可以执行自定义的业务逻辑 ———— 定义接收任务通知后的方法。
class Subject {
constructor() {
this.observerList = [];
}
add(observer) {
this.observerList.push(observer);
}
remove(observer) {
this.observerList = this.observerList.filter(item => item !== observer)
}
notify(...args) {
this.observers.forEach(observer => observer.update(...args));
}
}
// 观察者
class Observer {
update(...args) {
console.log(...args);
}
}
// 创建观察者ob1
let ob1 = new Observer();
// 创建观察者ob2
let ob2 = new Observer();
// 创建目标sub
let sub = new Subject();
// 目标sub添加观察者ob1 (目标和观察者建立了依赖关系)
sub.add(ob1);
// 目标sub添加观察者ob2
sub.add(ob2);
// 目标sub触发SMS事件(目标主动通知观察者)
sub.notify('I fired `SMS` event', 'heelp');
发布订阅者模式
基于一个事件(主题)PubSub
通道,希望订阅者 subscriber
通过自定义事件 subscribe
订阅主题。发布者publisher
通过 publish
发布主题事件的方式通知各个订阅该主题的 Subscriber
对象。
因此发布订阅模式与观察者模式相比,发布订阅模式中有三个角色,发布者 Publisher
,事件调度中心 Event Channel
,订阅者 Subscriber
。
上面的文字有些难以理解,在现在的发布订阅模式中,称为发布者的消息发送者不会将消息直接发送给订阅者,这意味着发布者和订阅者不知道彼此的存在。在发布者和订阅者之间存在第三个组件,称为调度中心或事件通道,它维持着发布者和订阅者之间的联系,过滤所有发布者传入的消息并相应地分发它们给订阅者。
-
任务发布者 ——
Publisher
-
事件中心 ——
PubSub
- 维护任务类型
subscribers
对象,以及每种任务下的订阅情况 - 给订阅者提供订阅功能 ——
subscribe
功能 - 给发布者的提供发布任务 ——
publish
功能
- 维护任务类型
-
订阅者 ——
Subscriber
举一个例子,你在微博上关注了A,同时其他很多人也关注了A,那么当A发布动态的时候,微博就会为你们推送这条动态。A就是发布者,你是订阅者,微博就是调度中心,你和A是没有直接的消息往来的,全是通过微博来协调的(你的关注,A的发布动态)。
class PubSub {
constructor() {
this.subscribers = {
};
}
// 订阅
subsctibe(topic, cb) {
if (!this.subscribers[topic]) {
this.subscribers[topic] = []
}
this.subscribers[topic].push(cb)
}
// 取消订阅
unsubsctibe(topic, cb) {
let temp = this.subscribers[topic]
if (temp) {
let index = temp.findIndex(item => item === cb)
temp.splice(index, 1)
}
}
// 发布功能
publish(topic, ...args) {
if (this.subscribers[topic]) {
this.subscribers[topic].forEach(cb => cb(...args))
}
}
}
let clg = function(text) {
console.log(text)
}
// 创建事件调度中心,为订阅者和发布者提供调度服务
let pubSub = new PubSub();
// A订阅了SMS事件(A只关注SMS本身,而不关心谁发布这个事件)
pubSub.subscribe('SMS', clg);
// B订阅了SMS事件
pubSub.subscribe('SMS', clg);
console.log(pubSub.subscribers)
// C发布了SMS事件(C只关注SMS本身,不关心谁订阅了这个事件)
pubSub.publish('SMS', 'I published `SMS` event');
从代码实现可以看出,观察者模式则是面向目标和观察者编程的,而发布-订阅模式是面向调度中心编程的,前者用于耦合目标和观察者,后者用于解耦发布者和订阅者,不可同日而语也~