Javascript 中介者模式实例


Posted in Javascript onDecember 16, 2009

问题:

在页面上,用户会有很多的操作 ,每进行一次操作我们需要去展示操作的结果,在这里我们有了一个问题,我们应如何去展示不同的结果呢?在展示的过程中我们还要考虑当页面功能不断的增加与修改,结果展示也不断的增多,我们要用一个应对这些变化最好的方法解决问题。

解决方法:

在网盘开发中就遇到了这样的一个问题,经过几番的思考,决定了用如下的方式去解决这个问题,先看图:

 Javascript 中介者模式实例

 从图中我们可以知道,会使用到一个中介专门去接收使用者的信息,再发送到相应的展示主题,这样我们就可以解决了展示方式不段改变的问题,如何去展示就是展示主题代码问题了。

 这个方法也就是我们平常说的中介者模式,如果想了解更多的可以去google或baidu一下中介者模式。

代码:

好了,现在我符上一些代码,如果大家更好的解决方案也可以给我个评论。

/* 
* 中介 
**/ 
var Mediator = function(){ 
var self = this; 
var _messageObj = {}; 
this.Register = function(key,obj){ 
//注册中介 
_messageObj[key] = obj; 
}, 
this.Send = function(key,message){ 
//根据客户Key发送信息给客户 
if(_messageObj[key]){ 
_messageObj[key].Receive(message); 
} 
} 
} /* 
* 客户父类 
**/ 
var MessageBase = function(key,mediator){ 
mediator.Register(key,this); //注册中介 
} 
/* 
* 自由主题1 
**/ 
var MessageObj1 = function(key,mediator){ 
MessageBase.call(this,key,mediator); //继承父类 
this.Receive = function(message){ 
//接收中介消息 
alert("Object1 " + message); 
} 
} 
/* 
* 自由主题2 
**/ 
var MessageObj2 = function(key,mediator){ 
MessageBase.call(this,key,mediator); //继承父类 
this.Receive = function(message){ 
//接收中介消息 
alert("Object2 " + message); 
} 
} 
var med; //中介者 
var init = function(){ 
//客户代码 
med = new Mediator(); 
new MessageObj1("m1",med); 
new MessageObj2("m2",med); 
}; 
window.onload = function(){ 
init(); 
}

使用方法:
<a href="javascript://" onclick="med.Send('m1','Good');">test1</a> 
<a href="javascript://" onclick="med.Send('m2','GoodBoy');">test2</a>

下载:http://xiazai.3water.com/200912/yuanma/js_zhongjie.rar
Javascript 相关文章推荐
如何用javascript判断录入的日期是否合法
Jan 08 Javascript
JavaScript起点(严格模式深度了解)
Jan 28 Javascript
jQuery语法高亮插件支持各种程序源代码语法着色加亮
Apr 27 Javascript
jQuery 计算iframe 窗口大小的方法
May 13 Javascript
js实现宇宙星空背景效果的方法
Mar 03 Javascript
JavaScript encodeURI 和encodeURIComponent
Dec 04 Javascript
js遍历map javaScript遍历map的简单实现
Aug 26 Javascript
JavaScript中日常收集常见的10种错误(推荐)
Jan 08 Javascript
深入理解vue-loader如何使用
Jun 06 Javascript
js 显示日期时间的实例(时间过一秒加1)
Oct 25 Javascript
React 组件转 Vue 组件的命令写法
Feb 28 Javascript
在博客园博文中添加自定义右键菜单的方法详解
Feb 05 Javascript
js textarea自动增高并隐藏滚动条
Dec 16 #Javascript
javascript 动态设置已知select的option的value值的代码
Dec 16 #Javascript
javascript 语法基础 想学习js的朋友可以看看
Dec 16 #Javascript
JavaScript 解析Json字符串的性能比较分析代码
Dec 16 #Javascript
TextArea 控件的最大长度问题(js json)
Dec 16 #Javascript
比较详细的关于javascript 解析json的代码
Dec 16 #Javascript
JQuery读取XML文件数据并显示的实现代码
Dec 16 #Javascript
You might like
ThinkPHP的截取字符串函数无法显示省略号的解决方法
2014/06/25 PHP
PHP获取数组中重复最多的元素的实现方法
2014/11/11 PHP
详解PHP对象的串行化与反串行化
2016/01/24 PHP
PHP中抽象类和抽象方法概念与用法分析
2016/05/24 PHP
Yii2中设置与获取别名的函数(setAlias和getAlias)用法分析
2016/07/25 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
PHP实现的二分查找算法实例分析
2017/12/19 PHP
PHP智能识别收货地址信息实例
2019/01/05 PHP
JQuery与Ajax常用代码实现对比
2009/10/03 Javascript
19个很有用的 JavaScript库推荐
2011/06/27 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
2015/09/05 Javascript
Javascript函数式编程语言
2015/10/11 Javascript
简单实现bootstrap导航效果
2017/02/07 Javascript
angularjs+bootstrap菜单的使用示例代码
2017/03/07 Javascript
jQuery列表检索功能实现代码
2017/07/17 jQuery
JS实现多物体运动的方法详解
2018/01/23 Javascript
微信小程序 wx:for遍历循环使用实例解析
2019/09/09 Javascript
Django框架下在URLconf中指定视图缓存的方法
2015/07/23 Python
python3解析库BeautifulSoup4的安装配置与基本用法
2018/06/26 Python
在cmder下安装ipython以及环境的搭建
2018/10/19 Python
解决Pycharm调用Turtle时 窗口一闪而过的问题
2019/02/16 Python
Apache,wsgi,django 程序部署配置方法详解
2019/07/01 Python
python3.7通过thrift操作hbase的示例代码
2020/01/14 Python
Python如何通过Flask-Mail发送电子邮件
2020/01/29 Python
Python将二维列表list的数据输出(TXT,Excel)
2020/04/23 Python
Marriott国际:万豪国际酒店查询预订
2017/09/25 全球购物
资源环境与城市管理专业推荐信
2013/11/30 职场文书
会计电算化专业毕业生推荐信
2013/12/24 职场文书
博士学位自我鉴定范文
2013/12/26 职场文书
致跳高运动员加油稿
2014/02/12 职场文书
公司募捐倡议书
2014/05/14 职场文书
超市开业庆典策划方案
2014/05/14 职场文书
邮政竞聘演讲稿
2014/09/03 职场文书
2014年行政部工作总结
2014/11/19 职场文书
linux目录管理方法介绍
2022/06/01 Servers