【设计模式】我这样学习设计模式-发布订阅者模式

2022-12-10 11:15:58 浏览数 (2)


发布-订阅者模式

虽然你可能还不熟悉 发布-订阅者 模式,但你肯定已经用过它了。因为 发布-订阅者 模式在前端领域可谓是无处不在。

为什么这么说呢,因为 EventTarget.addEventListener() 就是一个 发布-订阅者 模式。先卖个关子,看完本文你就能理解了。

定义

发布-订阅者模式其实是一种对象间 一对多 的依赖关系(利用消息队列)。当一个对象的状态(state)发生改变时,所有依赖于它的对象都得到状态改变的通知。

订阅者(Subscriber)把自己想订阅的事件注册(Subscribe)到调度中心(Event Channel),当发布者(Publisher)发布该事件(Publish Event)到调度中心,也就是该事件触发时,由调度中心统一调度(Fire Event)订阅者注册到调度中心的处理代码。

特点

⭐ 通常情况下,我们都是先定义一个普通函数或者事件,然后再去调用。发布-订阅者 模式是为了让 发布者订阅者 解耦。

发布-订阅者 模式是一对多的关系,也就是说一个调度中心,对应多个订阅者。

发布-订阅者 模式会有一个队列(Queue),也就是先进先出。在 js 中,使用 Array 来模拟队列[fn1,fn2,fn3],先定义的先执行。

⭐ 先定义好一个消息队列,需要的对象去订阅。对象不再主动触发,而是被动接收。

一个例子理解

普通程序员张三去书店买书 张三:请问有红宝书吗? 店员:没有。 一小时后····· 张三:请问有红宝书吗? 店员:没有。 一小时后····· 张三:请问有红宝书吗? 店员:没有。

普通的程序员买书,需要频繁的调用对应的方法,这种轮询的方式无疑会增加负担。

那么一个发布订阅者模式的程序员怎样买书呢?

发布订阅者模式程序员李四去书店买书 李四:请问有红宝书吗? 店员:没有。 李四:我要订阅(on)这本书,当书有货的时候,请给我打电话(emit),我就会过来买书(message)。如果我在其它地方买到书了,请取消订阅(off)。

在这个例子中,店员属于发布者,李四属于订阅者;李四将买书的事件注册到调度中心,店员作为发布者,当有新书发布时,店员发布该事件到调度中心,调度中心会及时发消息告知李四。

代码演示

发布-订阅者模式实现思路

0 人点赞