JS设计模式(5)发布订阅模式
什么是发布订阅模式(观察者模式)?
定义:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新。
主要解决:一个对象状态改变给其他对象通知的问题,而且要考虑到易用和低耦合,保证高度的协作。
何时使用:一个对象(目标对象)的状态发生改变,所有的依赖对象(观察者对象)都将得到通知,进行广播通知。
如何解决:使用面向对象技术,可以将这种依赖关系弱化。
关键代码:对于某一个topci用数组存放订阅者.
应用实例: 1、拍卖的时候,拍卖师观察最高标价,然后通知给其他竞价者竞价。 2、西游记里面悟空请求菩萨降服红孩儿,菩萨洒了一地水招来一个老乌龟,这个乌龟就是观察者,他观察菩萨洒水这个动作。
优点: 1、观察者和被观察者是抽象耦合的。 2、建立一套触发机制。
缺点: 1、如果一个被观察者对象有很多的直接和间接的观察者的话,将所有的观察者都通知到会花费很多时间。 2、如果在观察者和观察目标之间有循环依赖的话,观察目标会触发它们之间进行循环调用,可能导致系统崩溃。 3、观察者模式没有相应的机制让观察者知道所观察的目标对象是怎么发生变化的,而仅仅只是知道观察目标发生了变化。
使用场景:
- 一个抽象模型有两个方面,其中一个方面依赖于另一个方面。将这些方面封装在独立的对象中使它们可以各自独立地改变和复用。
- 一个对象的改变将导致其他一个或多个对象也发生改变,而不知道具体有多少对象将发生改变,可以降低对象之间的耦合度。
- 一个对象必须通知其他对象,而并不知道这些对象是谁。
- 需要在系统中创建一个触发链,A对象的行为将影响B对象,B对象的行为将影响C对象……,可以使用观察者模式创建一种链式触发机制。
注意事项: 1、避免循环引用。 2、如果顺序执行,某一观察者错误会导致系统卡壳,一般采用异步方式。
代码实现
/*
*发布-订阅模式(观察者模式)
*/
function pubsub() {
var _pubsub = {},//全局对象,即发布订阅对象
_topics = {}, // 回调函数存放的数组
_subUid = 0; // 发布方法
_pubsub.publish = function (topic) {
if (!_topics[topic]) {
return false;
}
var args = [].slice.call(arguments, 1);
setTimeout(function () {
var subscribers = _topics[topic];
for (var i = 0, j = subscribers.length; i < j; i++) {
subscribers[i].callback.apply(null, args);
}
}, 0);
return true;
};
//订阅方法
_pubsub.subscribe = function (topic, callback) {
if (!_topics[topic]) {
_topics[topic] = [];
}
var token = (++_subUid).toString();
_topics[topic].push({
token: token,
callback: callback
});
return token;
};
//退订方法
_pubsub.unsubscribe = function (token) {
for (var m in _topics) {
if (_topics[m]) {
for (var i = 0, j = _topics[m].length; i < j; i++) {
if (_topics[m][i].token === token) {
_topics[m].splice(i, 1);
return token;
}
}
}
}
return false;
}; return {
subscribe: _pubsub.subscribe,
publish: _pubsub.publish,
unsubscribe: _pubsub.unsubscribe
}
}
JS设计模式(5)发布订阅模式的更多相关文章
- js设计模式之发布/订阅模式模式
一.前言 发布订阅模式,基于一个主题/事件通道,希望接收通知的对象(称为subscriber)通过自定义事件订阅主题,被激活事件的对象(称为publisher)通过发布主题事件的方式被通知. 就和用户 ...
- 浅谈js设计模式之发布 — 订阅模式
发布 — 订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在 JavaScript开发中,我们一般用事件模型来替代传统的发布 — ...
- js设计模式之发布订阅模式
1. 定义 发布-订阅模式其实是一种对象间一对多的依赖关系,当一个对象的状态发送改变时,所有依赖于它的对象都将得到状态改变的通知. 订阅者(Subscriber)把自己想订阅的事件注册(Subscri ...
- [转] JavaScript设计模式之发布-订阅模式(观察者模式)-Part1
<JavaScript设计模式与开发实践>读书笔记. 发布-订阅模式又叫观察者模式,它定义了对象之间的一种一对多的依赖关系.当一个对象的状态发生改变时,所有依赖它的对象都将得到通知. 例如 ...
- JS 设计模式八 -- 发布订阅者模式
概念 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多(一个发布,多个观察)的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知. 优点 1 ...
- JS中的发布订阅模式
一. 你是如何理解发布订阅模式的 JS中的设计模式: 单例模式:处理业务逻辑 构造原型模式:封装类库,组件,框架,插件等 类库:jQuery 只是提供了一些常用的方法,可以应用到任何的项目中,不具备业 ...
- JavaScript设计模式(发布订阅模式)
发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知.在JavaScript开发中,我们一般用事件模型来替代传统的发布—订阅模式 ...
- Javascript设计模式之发布-订阅模式
简介 发布-订阅模式又叫做观察者模式,他定义了一种一对多的依赖关系,即当一个对象的状态发生改变的时候,所有依赖他的对象都会得到通知. 回忆曾经 作为一名前端开发人员,给DOM节点绑定事件可是再频繁不过 ...
- javascript中的设计模式之发布-订阅模式
一.定义 又叫观察者模式,他定义对象间的依照那个一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将的到通知.在javascript中,我们一般用时间模型来替代传统的发布-订阅模式 二 ...
- js里的发布订阅模式及vue里的事件订阅实现
发布订阅模式(观察者模式) 发布订阅模式的定义:它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布订阅模式在JS中最常见的就是DOM的事件绑定与触发 ...
随机推荐
- nw.js---创建一个点击菜单
使用nw.js创建一个可点击的菜单: <!doctype html> <html lang="en"> <head> <meta char ...
- 10.27 rest_framework(1)
2018-10-27 16:48:04 前几天在整理django博客! 新学的rest_framework框架是源于Django的 使用的时候得 pip install djangorestframe ...
- 4 html文件引用问题
通常在写html文件的时候会遇到需要引入样式文件,或者图片等问题,对于有一定开发经验的人来说,这些都不是问题,做为初学者,还是有必要理解html文件引用的“思路”的 当html文件和要引用的文件在同一 ...
- poj2109 【贪心】
Current work in cryptography involves (among other things) large prime numbers and computing powers ...
- swust oj 956
约瑟夫问题的实现 2000(ms) 65535(kb) 3266 / 10775 n个人围成一个圈,每个人分别标注为1.2.....n,要求从1号从1开始报数 ,报到k的人出圈,接着下一个人又从1开始 ...
- 地图标绘系统V1.0测试版【申明:来源于网络】
地图标绘系统V1.0测试版[申明:来源于网络] 地址:http://blog.csdn.net/allgis/article/details/39718085
- iOS 弹出菜单UIMenuController的基本使用
UIMenuController,弹出菜单@implementation DragView{ CGPoint startLocation; CGFloat rotation;}-(inst ...
- Gym 101194D / UVALive 7900 - Ice Cream Tower - [二分+贪心][2016 EC-Final Problem D]
题目链接: http://codeforces.com/gym/101194/attachments https://icpcarchive.ecs.baylor.edu/index.php?opti ...
- LaTeX参考文献出现问号
自己用LaTeX编辑,忘记在\end{document}前面放: \bibliographystyle{ieeetr}\bibliography{sample-bibliography} 导致这个现象 ...
- WCF中的ServiceHost初始化两种方式
1 代码方式 using(ServiceHost host=new ServiceHost(typeof(HelloWordService))) { host.AddServiceEndpoint(t ...