观察者模式
定义
观察者模式（又被称为发布-订阅（Publish/Subscribe）模式，属于行为型模式的一种，它定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象。这个主题对象在状态变化时，会通知所有的观察者对象，使他们能够自动更新自己
注意（观察者模式和发布订阅是有不同的）
区别
观察者模式 在软件设计中是一个对象，维护一个依赖列表，当任何状态发生改变自动通知它们。
发布-订阅模式 消息的发送方，叫做发布者（publishers），消息不会直接发送给特定的接收者，叫做订阅者。
左边相当于微信里的微商-顾客之间的关系。右边相当于商家-淘宝-顾客之间的关系
观察者模式：顾客关注了微商的商品，微商会记住顾客关注的商品，一旦上新就直接 私聊 通知所有关注这个商品的顾客。这里的顾客就相当于观察者，这里的微商就相当于主题
订阅发布模式：顾客通过淘宝（APP或者网站）关注了商家的商品，商家一旦上新就通过淘宝（APP或者网站）向关注了它的顾客 群发 消息。这里的顾客就是订阅者，这里的淘宝就是事件总线，这里的商家就是发布者
DOM事件
只要我们曾经在DOM节点上面绑定过事件函数，那我们就使用过观察者模式，应为JS和DOM之间就是实现了一种观察者模式
document.body.addEventListener("click", function() { alert("Hello World")}，false )document.body.click() //模拟用户点击 自定义一个简单的小例子
// 定义商家let merchants = {}// 定义预定列表merchants.orderList = {}// 将增加的预订者添加到预定客户列表中merchants.listen = function(id, info) { if(!this.orderList[id]) { this.orderList[id] = [] } this.orderList[id].push(info) console.log('预定成功')}//发布消息merchants.publish = function(id) { let infos = this.orderList[id] // 判断是否有预订信息 if(!infos || infos.length === 0) { console.log('您还没有预订信息!') return } // 如果有预订信息，则循环打印 infos.forEach((el, index) => { console.log('尊敬的客户：') el.call(this, arguments) console.log('已经到货了') })}merchants.remove = function(id, fn) { // 撤销订单 var infos = this.orderList[id] if(infos instanceof Array){ infos.forEach((el, index) => { el === fn && this.orderList[id].splice(index, 1) }) } console.log('撤销成功')}// 定义一个预订者customerA，并指定预定信息let customerA = function() { console.log('黑色至尊版一台')}let customerB = function() { console.log('白色至尊版一台')}let customerC = function() { console.log('红色至尊版一台')}// customerA 预定手机，并留下预约电话merchants.listen('15888888888', customerA) // 预定成功merchants.listen('15888888888', customerB) // 预定成功merchants.listen('15777777777', customerB) // 预定成功merchants.listen('15777777777', customerC) // 预定成功merchants.remove('15888888888', customerB) // 撤销成功// 商家发布通知信息merchants.publish('15888888888')merchants.publish('15777777777')预定成功预定成功预定成功预定成功撤销成功尊敬的客户：黑色至尊版一台已经到货了尊敬的客户：白色至尊版一台已经到货了尊敬的客户：红色至尊版一台已经到货了 优缺点
优点：
- 时间上的解耦
- 对象之间的解耦
缺点：
- 创建订阅者本身要消耗一定的时间和内存
- 当订阅一个消息时，也许此消息并没有发生，但这个订阅者会始终存在内存中。
- 观察者模式弱化了对象之间的联系，这本是好事情，但如果过度使用，对象与对象之间的联系也会被隐藏的很深，会导致项目的难以跟踪维护和理解
对于观察者模式还只是浅薄的认识，如有不对，还请大佬们指出，感谢(✿◕‿◕✿)
参考链接