JS实现一个发布-订阅模式（观察者模式）

// 创建一个简单的事件中心，允许对象订阅事件、发布事件并取消订阅。
// 创建一个事件中心对象,IIFE,返回一个包含订阅、取消订阅和发布方法的对象
const EventCenter = (function () {
    // 存储事件及其对应的订阅者，存储事件及其对应的监听器数组
    const events = {}

    return {
        // 订阅事件,将监听器函数添加到事件数组中
        subscribe: function (event, listener) {
            // 如果事件不存在，则创建一个新的数组
            if (!events[event]) {
                events[event] = []
            }
            // 若事件存在 ，则将监听器函数添加到事件数组中
            events[event].push(listener)
        },
        // 取消订阅事件
        unsubscribe: function (event, listener) {
            // 如果事件不存在，则直接返回
            if (!events[event]) {
                return
            }
            // 如果事件存在，则找到对应的监听器并移除
            events[event] = events[event].filter(fn => fn !== listener)
        },
        // 发布事件，执行事件数组中的所有监听器函数
        publish: function (event, data) {
            // 如果事件不存在，则直接返回
            if (!events[event]) {
                return
            }
            // 如果事件存在，则遍历事件数组并执行所有监听器函数
            events[event].forEach(listener => listener(data))
        }
    }
})()

// 用法
// 声明第一次事件
function eventListener1(data) {
    console.log('事件1被触发，接收到的数据是：', data);
}
// 订阅第一次事件
EventCenter.subscribe('event1', eventListener1)
// 声明第二次事件
function eventListener2(data) {
    console.log('事件2被触发，接收到的数据是：', data);
}
// 订阅第二次事件，但都放在event1中
EventCenter.subscribe('event1', eventListener2)
// 发布事件，结果是两个事件都被触发
EventCenter.publish('event1', { message: 'Hello, subscribers!' })
// 取消订阅事件
EventCenter.unsubscribe('event1', eventListener1)
// 再次发布事件,结果是只有事件二被触发
EventCenter.publish('event1', { message: 'Hello, subscribers!' })

订阅者-发布者原理让我们更好的理解软件架构设计模式，事件的注入 ，是一个很好的关注点。