# 发布订阅者模式

基于一个事件通道,希望接收通知的对象(称为订阅者subscriber)通过自定义事件订阅主题,激活事件的对象通过发布主题事件的方式来通知订阅者。

事件发布/订阅模式 (PubSub) 在异步编程中帮助我们完成更松的解耦, 甚至在 MVC、MVVC 的架构中以及设计模式中也少不了发布-订阅模式的参与。

优点: 在异步编程中实现更深的解耦

缺点: 如果过多的使用发布订阅模式, 会增加维护的难度

# 例子

最简单的例子就是 button 按钮的点击事件,在用户没点击之前,我们已经为它写好了点击之后应该做什么操作,这个行为称为 “订阅” ,当用户点击按钮的时候,触发订阅中的行为,这个称之为“发布”

// 发布订阅者模式
var Event = function() {
    this.obj = {};
};

Event.prototype.on = function(eventType, fn) {
    if (!this.obj[eventType]) {
        this.obj[eventType] = [];
    }
    this.obj[eventType].push(fn);
};

Event.prototype.emit = function(...arguments) {
    // arguments是类数组对象,不可直接使用数组方法,下面使arguments使用shift方法
    var eventType = Array.prototype.shift.call(arguments);

    var arr = this.obj[eventType];
    for (let i = 0; i < arr.length; i++) {
        // arguments上一步骤已经去除了第一个元素,剩下后面的元素,调用所对应的方法
        arr[i].apply(arr[i], arguments);
    }
};

var eventInstance = new Event();

// 先订阅eat这个事件
eventInstance.on("eat", function(name) {
    console.log('Wash your hands before eating');
});
eventInstance.on("eat", function(name) {
    console.log(name + " is eating.");
});

// 在必要的地方发布eat这个事件
eventInstance.emit("eat", "xiaoming"); // Wash your hands before eating, xiaoming is eating.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

# 观察者模式 VS 发布订阅模式

观察者模式与发布订阅模式都是定义了一个一对多的依赖关系,当有关状态发生变更时则执行相应的更新。

不同的是,在观察者模式中依赖于 Subject 对象的一系列 Observer 对象在被通知之后只能执行同一个特定的更新方法,而在发布订阅模式中则可以基于不同的主题去执行不同的自定义事件。相对而言,发布订阅模式比观察者模式要更加灵活多变。