繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Javascript 模式实例 观察者模式
- Javascript
- 自己开发Dojo的建议框架
- js每次Title显示不同的名言
- 不用AJAX和IFRAME,说说真正意义上的ASP+JS无刷新技术
- 无限级别的菜单（侧拉菜单）
- 点选TOP后并不是直接跳到页顶的，而是滚动上去
- js下拉菜单中自动信息轮换播放
- 英文首字母全大写的js实现脚本
- 实例区别onClick和onDBClick两事件方法
- 改变文本框字体颜色的js脚本
- js星空效果代码
- 判断li是否有样式的js代码
- 文本框点击时文字消失，失去焦点时文字出现
- 如何让一个层关闭之后，就算刷新页面了也不显示。除非关闭页面再次打开
- 右下角弹出窗口效果代码
- JS控制对象移动效果
- 验证用户是否修改过页面的数据的实现方法
- Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
- 正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
- EXT富客户端后台管理系统 初步代码
- 不同浏览器javascript变量作用域的处理方法
Javascript 模式实例 观察者模式
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 363 ::
收藏到网摘: n/a
首先我们看看观察者的概念 观察者模式：定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时, 所有依赖于它的对象都得到通知并被自动更新。 在园里有许多牛人都已经写过这些文章，不过大多的例子都是.NET，今天我要举一个JS的使用实例．有兴趣的朋友可以先了解一下一些牛人的，比如李会军大哥设计模式篇中观察者的那一节
http://www.cnblogs.com/Terrylee/archive/2006/10/23/Observer_Pattern.html
说说我自己对这模式的理解，其思想核心是：每个被观察对象都依据对象数据的改变而改变，被观察对象一定要有同样的改变行为来约束，这个约束是被观察对象提供给观察器的统一接口。观察器会开发改变数据的行为。
JS是弱类型的脚本，很多东西都要约定的，不象.NET会有接口的约束，废话不多说，我们直接看实例：
观察者实例
复制代码 代码如下:
var ObserverObj = { /**//*依赖对象*/
FirstName: "Max",
LastName: "Gan",
Id: 1
}
var ObserverManager = { /**//*观察器*/
Observers:[], /**//*观察对象集*/
AddObserver: function(item){/**//*加入观察对象*/
this.Observers.push(item);
},
Change: function(obj){ /**//*改变对象行为*/
for(var item in obj){
ObserverObj[item] = obj[item];
}//改变数据依赖对象数据
for(var i = 0,len = this.Observers.length; i < len; i++){
var item = this.Observers[i];
item.Display(); //对象改变后，改变观察对象的行为Display; 为统一的接口
}
}
}
var Header = function(){ /**//*观察对象Header*/
this.Display = function(){
alert(ObserverObj.FirstName);
}
}
var Content = function(){ /**//*观察对象Content*/
this.Display = function(){
alert(ObserverObj.LastName);
}
}
var Foot = function(){ /**//*观察对象Foot*/
this.Display = function(){
alert(ObserverObj.Id);
}
}
上面的例子ObserverManager只提供了绑定的方法（AddObserver），其他的什么取消绑定啊之类的代码技巧，可能大家想一下就知道了．其实这些代码的最终目的就是当改变了Observers数据，其他的被对象也会根据数据的改变作出相应的回应．OK，现在我们把他们绑定一下．
复制代码 代码如下:
/***绑定观察器动作***/
ObserverManager.AddObserver(new Header());
ObserverManager.AddObserver(new Content());
ObserverManager.AddObserver(new Foot());
最后我们使用会怎么使用呢？（一个低能的问题．．．呵呵）看例子.
使用方法
复制代码 代码如下:
<!--使用方法-->
<a href="javascript://" onclick="ObserverManager.Change({FirstName:'老婆'});">改变FirstName</a>
<a href="javascript://" onclick="ObserverManager.Change({LastName:'是母老虎'});">改变LastName</a>
<a href="javascript://" onclick="ObserverManager.Change({Id:2});">改变Id</a>
我把整个例子都附上了，有兴趣的朋友可以下载来看看．
Javascript观察者模式.rar
一个人能够走多远,取决于与谁同行
评论 (0) All
