js实现发布订阅模式(简易版)

397 阅读1分钟

发布订阅模式概念

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

三个主角: 订阅者、调度中心、发布者

发布订阅模式实例

/**
 * 发布 - 订阅模式
 */
//定义一个新闻发布平台
//主要功能包括任务发布大厅(informationWarehouse),以及订阅任务(subscribe),发布任务(release)
let task = {
    informationWarehouse: {},
    subscribe(key, fn) {
        if (typeof this.informationWarehouse[key] === "undefined") {
            this.informationWarehouse[key] = []
        }
        this.informationWarehouse[key].push(fn) // 订阅的消息推送到调度中心
    },
    release(type, news) {
        let fns = this.informationWarehouse[type]
        // 如果调度中心没有这个资源,返回结束
        if (typeof fns === "undefined" || fns.length === 0) return;
        fns.forEach(fn => {
            fn(news);
        })
    }
}
console.log("----- 订阅 -----");
// 订阅 娱乐头条
task.subscribe('娱乐', val => {
    console.log('小王订阅的娱乐头条', JSON.stringify(val))
})
// 订阅 科技头条
task.subscribe('科技', val => {
    console.log('小刘订阅的科技头条', JSON.stringify(val))
})
// 订阅 历史头条
task.subscribe('历史', val => {
    console.log('小李订阅的历史头条', JSON.stringify(val))
})
/**
 * 系统推送头条
 */
console.log("----- 发布 -----");
task.release('娱乐', {
    title: "大衣哥给儿媳妇红包的言外之意",
    url: "https://www.toutiao.com/a6966769740203262478"
})
task.release('科技', {
    title: "192号段发放在即 中国广电5G渐近",
    url: "https://www.toutiao.com/a6966480940277334535"
})
task.release('历史', {
    title: "袁隆平的父母何许人也?",
    url: "https://www.toutiao.com/a6966099280075424267"
})
console.log("调度中心", task.informationWarehouse);

发布订阅模式