摘要：观察者模式机动建立一种对象与对象之间的依赖关系，一个对象发生改变时将自动通知其他对象，其他对象将相应做出反应。
观察者模式模式简介
观察者模式（又被称为发布-订阅（Publish/Subscribe）模式，属于行为型模式的一种，它定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象。这个主题对象在状态变化时，会通知所有的观察者对象，使他们能够自动更新自己。观察者模式机动
建立一种对象与对象之间的依赖关系，一个对象发生改变时将自动通知其他对象，其他对象将相应做出反应。在此，发生改变的对象称为观察目标，而被通知的对象称为观察者，一个观察目标可以对应多个观察者，而且这些观察者之间没有相互联系，可以根据需要增加和删除观察者，使得系统更易于扩展，这就是观察者模式的模式动机。生活中的观察者模式
现在年轻人都喜欢玩手机，比如我自己我是比较爱看直播，每个直播间都有一个订阅的按钮，如果你喜欢这个直播你就会订阅一下它，但是每个主播开播的时间是不固定的，我们不能一直盯着直播间看吧，这样很浪费时间也错过了其他的内容，所以你订阅它之后，每个主播开播都会向自己订阅的号发布自己开播的消息代码分析
我们使用Es6先创建一个class
// 发布订阅实现
class Observer {
constructor () {
}
}
订阅（subscribe）的函数callback参数用作传入的订阅者回调函数，this.subscribers.length插入当前自己应当的位置
subscribe (callback) {
// 将传入的函数赋予这个数组
this.subscribers[this.subscribers.length] = callback
}
退订（retreatSubscribe）函数，传入退订者的回调函数，循环存储订阅者的数组this.subscribers，根据传入的退订者和订阅者数组中对比，相同者删除订阅者
retreatSubscribe (callback) {
for(var i = 0;i < this.subscribers.length;i++) {
if(this.subscribers[i] === callback){
delete (this.subscribers[i])
}
}
}
观察（publish）函数，观察订阅者的动作，this指向的是这个class Observer，将Observer内的函数方法赋予订阅者对象，声明数组用作存储订阅者回调函数
make (o) {
// this === Observer这个对象的函数
for(var i in this){
// this[i]Observer对象里面的每个方法
o[i] = this[i]
// 声明数组用作存储订阅者回调函数
o.subscribers = []
}
}
发布（publish）函数，循环存储订阅者回调函数的数组，检测是否为函数，如果是函数进行发布消息
//发布
publish (what) {
for(var i = 0;i< this.subscribers.length;i++){
if(typeof this.subscribers[i] === "function"){
// add函数
this.subscribers[i](what)
}
}
}
代码组合起来
下面的class代码是我将上面步骤的组合到一起的一系列代码，由订阅对象，观察对象，发布消息，退订组成的观察者模式，也叫发布订阅
class Observer {
constructor () {}
// 订阅
subscribe (callback) {
// 将传入的函数赋予这个数组
this.subscribers[this.subscribers.length] = callback
}
// 退订
retreatSubscribe (callback) {
for(var i = 0;i < this.subscribers.length;i++) {
if(this.subscribers[i] === callback){
delete (this.subscribers[i])
}
}
}
// 观察对象
make (o) {
// this === Observer这个对象的函数
for(var i in this){
// this[i]Observer对象里面的每个方法
o[i] = this[i]
// 声明数组用作存储订阅者回调函数
o.subscribers = []
}
}
// 发布
publish (what) {
for(var i = 0;i< this.subscribers.length;i++){
if(typeof this.subscribers[i] === "function"){
// add函数
this.subscribers[i](what)
}
}
}
}
使用上面的观察者
1.我们必须创建一个订阅者对象
let people = {
}
2.我们观察这个对象并且赋值给这个对象可以使用的功能，我们让他可以行动，可以做出行为举止
Observer.make(people)
3.声明想发布的信息代码
let wanglei = {
add (what) {
console.log("wanglei给" + what);
}
}
4.我们订阅一下想要发送的函数，我们这里正好是声明的函数，用来订阅用的，可以回顾上面订阅的函数代码
Observer.subscribe(wanglei.add)
5.发布消息我们将qaaa字符传递到add订阅函数的what形参里面用来组合发送消息
Observer.publish("qaaa")
//打印
wanglei给qaaa
6.退订既然可以订阅，我们就可以退订，退订主要走的retreatSubscribe函数，我们将订阅者的信息传递到退订函数就可以删除这个订阅者，之后再发布就无法再接收到相关信息
Observer.retreatSubscribe(wang.add)观察者优缺点
那么使用完观察者之后你们有什么感触，总的来说观察者有优点也有缺点，每个事物都一样总会有优缺点，但是观察者的优点在我们部分功能中起到很多作用，我们看看它的优缺点
优点：
1. 支持简单的广播通信，自动通知所有已经订阅过的对象 2. 目标对象与观察者存在的是动态关联，增加了灵活性 3. 目标对象与观察者之间的抽象耦合关系能够多带带扩展以及重用
缺点：
1. 如果一个观察目标对象有很多直接和间接的观察者的话，将所有的观察者都通知到会花费很多时间 2. 如果在观察者和观察目标之间有循环依赖的话，观察目标会触发它们之间进行循环调用，可能导致系统崩溃 3. 观察者模式没有相应的机制让观察者知道所观察的目标对象是怎么发生变化的，而仅仅只是知道观察目标发生了变化
最后我们的观察者就到这里了
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/109872.html
摘要：观察者模式定义设计模式中对的定义一个对象称为维持一系列依赖于它观察者的对象，将有关状态的任何变更自动通知给它们。如图模式比较观察者模式则多了一个类似于话题调度中心的流程，发布者和订阅者解耦。 Obeserver（观察者）模式 定义 《js设计模式》中对Observer的定义：一个对象（称为subject）维持一系列依赖于它（观察者）的对象，将有关状态的任何变更自动通知给它们。 《设计模...
摘要：观察者模式对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都得到通知并被自动更新。具体主题角色在具体主题内部状态改变时，给所有登记过的观察者发出通知。 观察者模式 对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都得到通知并被自动更新。 观察者要素 1.抽象主题(Subject)角色：把所有对观察者对象的引用保存在一个集合中，每个...
摘要：期设计模式如何理解观察者发布订阅模式定义观察者模式又叫发布订阅模式，它定义了一种一对多的关系，让多个观察者对象同时监听某一个主题对象，这个主题对象的状态发生变化时就会通知所有的观察者对象，使得它们能够自动更新自己生活实例理解你今天去看一个 20190411期 设计模式-如何理解观察者(发布订阅)模式? 定义: 观察者模式又叫发布订阅模式（Publish/Subscribe），它定义了一...
阅读 3670·2021-09-22 15:28
阅读 1295·2021-09-03 10:35
阅读 877·2021-09-02 15:21
阅读 3474·2019-08-30 15:53
阅读 3494·2019-08-29 17:25
阅读 569·2019-08-29 13:22
阅读 1555·2019-08-28 18:15
阅读 2285·2019-08-26 13:57
