js观察者模式
来源:互联网 发布:linux操作系统下载 编辑:程序博客网 时间:2024/06/06 02:19
观察者模式又叫发布订阅模式
(Publish/Subscribe),它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个主题对象的状态发生变化时就会通知所有的观察者对象,使得它们能够自动更新自己。
使用观察者模式的好处:
1、支持简单的广播通信,自动通知所有已经订阅过的对象。2、页面载入后目标对象很容易与观察者存在一种动态关联,增加了灵活性。3、目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。
思路:
1、发布者对象需要一个数组类型的属性,以存储所有的订阅者。
2、订阅(即注册)行为就是将新的订阅者加入到这个数组中去,
3、则注销即是从这个数组中删除某个订阅者。
4、发布消息,就是循环遍历订阅者列表并通知他们。
先定义一个event对象,其内部包含了3个方法:订阅、发布、删除。
var event = { //设置3个变量; var clientList:[], //订阅者缓存列表 listen,//订阅 trigger,//发布 remove;//删除 //订阅方法: listen = function(key,fn){ if(!clientList[key]){//如果订阅者不存在了,则,清空原来的内容; clientList[key] = []; } clientList[key].push(fn); //订阅者添加进缓存列表 }; trigger = function(){ //发布消息 var key = Array.prototype.shift.call(arguments), fns = clientList[key]; if(!fns || fns.length == 0){ //没有绑定对应的消息 return false; } for(var i=0,fn; fn=fns[i++]){//遍历缓存队列,发送消息; fn.apply(this, arguments); } }; remove = function(key,fn){ //删除订阅 var fns = clientList[key]; if(!fns){ //如果key对应的消息没有被人订阅,则直接返回 return false; } if(!fn){ //如果没有传入具体的回调函数,表示需要取消key对应消息的所有订阅 fns && (fns.length = 0); }else{ for(var l=fns.length-1; l>=0; l--){ //反向遍历订阅的回调函数列表 var _fn = fns[l]; if(_fn ===fn){ fns.splice(l,1); //删除订阅者的回调函数 } } } }; return { listen:listen, trigger:trigger, remove:remove }; }; Event.listen('squareMeter150',function(price){ // 李四订阅消息 console.log('价格=' + price); }); Event.trigger('squareMeter150',2000000); // 输出 2000000
阅读全文
0 0
- JS实现观察者模式
- js观察者模式
- js观察者模式
- js观察者模式
- js观察者模式2
- js实现观察者模式
- js观察者模式
- js实现观察者模式
- JS观察者模式
- js观察者模式
- js观察者模式
- 【JS】观察者模式
- js观察者模式
- js设计模式-观察者模式
- js设计模式-----观察者模式
- JS设计模式-观察者模式
- js观察者模式简单实现
- js 设计模式学习--观察者模式
- (CodeForces
- JavaScript之路(2)JavaScript的对象
- Python生成器
- 01背包问题(最易理解的讲解)
- 解决“suse12无法登录,显示module is unknown”问题
- js观察者模式
- ConfigurationSettings.AppSettings 已过时
- 堆排序 (包括升序和降序,Arraylist 实现)
- CentOS 6.x安装配置GitLab(企业版Git管理)
- nginx安装
- secureCRT常用指令
- window.location.hash 使用说明
- 微信小程序入门实例——swiper
- 弹性布局学习笔记