发布订阅模式
【发布订阅模式】定义：发布/订阅与观察者模式原理差不多，都是定义一对多的依赖关系，当相关状态更新就会触发相应的更新
本文代码执行流程与流程图基本相同(本文仅为了加深理解，没有添加取消订阅等方法)
文章图片
// 发布者
function Publish() {
this.themes = []
// 添加
this.setCol = function (theme) {
this.themes.push(theme)
}
// 主题更新
this.public = function (theme) {
const { themes } = this
for (let i = 0;
i < themes.length;
i++) {
if (themes[i] === theme) {
console.log(`发布者触发${theme.name}主题更新`)
theme.notify()
}
}
}
}
// 主题
function Theme(name, callback) {
this.name = name
this.callback = callback
this.subscrib = []
this.setSub = function (sub) {
this.subscrib.push(sub)
}
this.notify = function () {
console.log(`${this.name}主题触发更新`)
this.subscrib.forEach((item) => {
item.updated(callback)
})
}
}
//订阅者
function Subscrib(name) {
this.name = name
this.updated = function (callback) {
console.log(`${this.name}接收到新消息`, callback(this.name))
}
}
const sub1 = new Subscrib('订阅者1')
const sub2 = new Subscrib('订阅者2')
const theme1 = new Theme('三国', (e) => e)
const theme2 = new Theme('楚汉', (e) => e)
const publish = new Publish('发布者')
publish.setCol(theme1)
publish.setCol(theme2)
theme1.setSub(sub1)
theme2.setSub(sub1)
theme2.setSub(sub2)
publish.public(theme1)
/*
发布者触发三国主题更新
三国主题触发更新
订阅者1接收到新消息 订阅者1
*/
publish.public(theme2)
/*
发布者触发楚汉主题更新
楚汉主题触发更新
订阅者1接收到新消息 订阅者1
订阅者2接收到新消息 订阅者2
*/推荐阅读
- 图文小编《杨浦、成毅》为你发布！无价之宝随意摆放的公园
- --木木--|--木木-- 第二课作业#翼丰会（每日一淘6+1实战裂变被动引流# 6+1模式）
- 设计模式-代理模式-Proxy
- 用npm发布一个包的教程并编写一个vue的插件发布
- 【译】Rails|【译】Rails 5.0正式发布（Action Cable，API模式等）
- java静态代理模式
- VueX（Vuex|VueX（Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式)
- Kotlin基础(10)-代理模式在kotlin中的使用
- 长谈的确是这个时代需要的一种模式
- 运用flutter|运用flutter 构建一个发布版（release）APK