设计模式4——发布订阅模式

大家好，欢迎来到IT知识分享网。

发布订阅——老生长谈的一个设计模式，还有一个观察者模式
1、定义
也称作观察者模式，定义了对象间的一种一对多的依赖关系，当一个对象的状态发 生改变时，所有依赖于它的对象都将得到通知

2、核心
取代对象之间硬编码的通知机制，一个对象不用再显式地调用另外一个对象的某个接口。
与传统的发布-订阅模式实现方式（将订阅者自身当成引用传入发布者）不同，在JS中通常使用注册回调函数的形式来订阅

3、优缺点
优点一为时间上的解耦，二为对象之间的解耦。可以用在异步编程中与MV*框架中
缺点：
创建订阅者本身要消耗一定的时间和内存，订阅的处理函数不一定会被执行，驻留内存有性能开销
弱化了对象之间的联系，复杂的情况下可能会导致程序难以跟踪维护和理解

实现1：JS中的事件就是经典的发布-订阅模式的实现
`// 1、前端的事件就是基于发布订阅模式实现的一种体现
// 订阅事件
document.body.addEventListener(‘click’, e=>e)
document.body.addEventListener(‘click’, e=>e)

// 发布事件
document.body.click()
`

实现2：手动实现发布订阅模式
ES6的箭头函数引入就是为了解决this指向性不明确问题，在这里单独处理了context环境，不影响箭头函数；
箭头函数的this优先级 > call的this优先级

`// 2、发布订阅模式的实现
class Observer {
constructor(){
this.items = {}
}
// 添加订阅
add(type, context, fn){
if(!this.items.type)
this.items.type = [];
this.items.type.push({
context,
fn
})
}

// 发布订阅
pulish(type){
    let arr = this.items.type || []
    arr.map(item=>{
       item.fn.call(item.context) 
    })
}

}

(function(){
this.a = ‘小明’
let job = new Observer()
job.add(‘onWork’, this, function (params) {
console.log(‘工作啦’, this.a)
})
job.pulish(‘onWork’)
})()`