js设计模式 之 观察者模式(一位重视基础的前端小菜鸟的成长之路)

观察者模式 又被称为 发布订阅者 模式  vue2.0中的数据双向绑定就用的是这个模式  

今天 就跟着小菜鸟 来了解下 入门级别的 观察者模式  大神 的话 欢迎指点

1.在工作中经常是 一个人负责一个模块 这个问题就来了  各个模块之间怎么进行 数据交流 沟通呢

还是拿着前人所举的例子 来说吧

   如果你在书写 新闻评论模块  需求是这样的 当用户发表评论的时候 会在评论展示模块尾部追加 新的评论  同时 用户的消息模块也会增加  如果用户删除了 留言区的信息,用户的消息模块数量也会递减

当然 在工作中可能  新闻评论模块 评论展示模块  消息模块 是由三位工程师书写的

如果 我就增加一个这样的功能 去吧 其他的俩位额代码 都看一遍 或者整合在一起 那样是不是 太浪费时间了  也很消耗我们的精力

再碰见这种问题的时候 观察者模式 是比较理想的解决方案

2.观察者模式 也会他人称为消息机制 或者发布-订阅者模式 是为了解决主题对象与观察者之间功能的耦合 上面的例子可能没听懂 那我们再举一个前人的例子 拿生活中的例子 来说

国家 发射卫星 是为了监控 气象信息 城市信息  飞机航班信息    这里的监控 你理解了 理解观察者模式就会懂一点了

把发射的卫星看做一个 “观察者”  飞在天上的飞机 就相当于一个 被观察者   或者说是一个主体对象  

当然这个对象 是可以变化 你可以观察 飞机的机身 轮胎 尾翼 等等 就是 你的需求中的消息 消息的内容是 时刻会发生变化的

飞机常常发出位置信息  比如 北京 到光走 途中经过 郑州 当经过郑州的时候 就会像天上的飞机 通报自己的位置  当卫星收到消息后就能确认飞机的位置了  不过仅仅 是卫星 知道了 和处理这些消息 是远远不够的  应该 让地面上中转站知道 才是我们发射卫星的原本的的想法   卫星把信息再反馈给 地面中转站 然后地面中转站再做出相对应的处理 

这样 飞机  卫星 中转站 之间就形成了 这样的关系 :

中转站要知道天上某架飞机的位置信息  那么都要在卫星上注册这架飞机的信息 以便收到这架飞机的信息 于是飞机每当经过一个地方的时候 都会向卫星发射一次位置信息 然后 卫星就发将飞机的位置信息 发送给那些 注册过该飞机的中转站 然后中转站收到之后  就会做出相对应的处理 防止出现意外。

3.听完上面的描述 可能对观察者模式 有一个基础的了解了吧

未完待续  

发布了107 篇原创文章 · 获赞 64 · 访问量 6656

猜你喜欢

转载自blog.csdn.net/yunchong_zhao/article/details/103914690