观察者模式js讲解实例(转)
来源:互联网 发布:python scikit神经网络 编辑:程序博客网 时间:2024/04/30 05:30
说说我自己对这模式的理解,其思想核心是:每个被观察对象都依据对象数据的改变而改变,被观察对象一定要有同样的改变行为来约束,这个约束是被观察对象提供给观察器的统一接口。观察器会开发改变数据的行为。
JS是弱类型的脚本,很多东西都要约定的,不象.NET会有接口的约束,废话不多说,我们直接看实例:
观察者实例
1var ObserverObj = { /**//*依赖对象*/
2 FirstName: "Max",
3 LastName: "Gan",
4 Id: 1
5}
6
7var ObserverManager = { /**//*观察器*/
8 Observers:[], /**//*观察对象集*/
9 AddObserver: function(item){/**//*加入观察对象*/
10 this.Observers.push(item);
11 },
12 Change: function(obj){ /**//*改变对象行为*/
13 for(var item in obj){
14 ObserverObj[item] = obj[item];
15 }//改变数据依赖对象数据
16 for(var i = 0,len = this.Observers.length; i < len; i++){
17 var item = this.Observers[i];
18 item.Display(); //对象改变后,改变观察对象的行为Display; 为统一的接口
19 }
20 }
21}
22
23var Header = function(){ /**//*观察对象Header*/
24 this.Display = function(){
25 alert(ObserverObj.FirstName);
26 }
27}
28
29var Content = function(){ /**//*观察对象Content*/
30 this.Display = function(){
31 alert(ObserverObj.LastName);
32 }
33}
34
35var Foot = function(){ /**//*观察对象Foot*/
36 this.Display = function(){
37 alert(ObserverObj.Id);
38 }
39}
上面的例子ObserverManager只提供了绑定的方法(AddObserver),其他的什么取消绑定啊之类的代码技巧,可能大家想一下就知道了.其实这些代码的最终目的就是当改变了Observers数据,其他的被对象也会根据数据的改变作出相应的回应.OK,现在我们把他们绑定一下.
/***绑定观察器动作***/
ObserverManager.AddObserver(new Header());
ObserverManager.AddObserver(new Content());
ObserverManager.AddObserver(new Foot());
最后我们使用会怎么使用呢?(一个低能的问题...呵呵)看例子.
使用方法
1 <!--使用方法-->
2 <a href="javascript://" onclick="ObserverManager.Change({FirstName:'老婆'});">改变FirstName</a>
3 <a href="javascript://" onclick="ObserverManager.Change({LastName:'是母老虎'});">改变LastName</a>
4 <a href="javascript://" onclick="ObserverManager.Change({Id:2});">改变Id</a>
- 观察者模式js讲解实例(转)
- Android实例讲解之观察者模式
- java之观察者模式实例讲解
- js 订阅者模式(观察者模式)
- Android观察者模式(Observable)实例
- 观察者模式实例
- 观察者模式实例
- 观察者模式实例代码
- 观察者模式实例
- 观察者模式实例解析
- 观察者模式实例
- 观察者模式(转)
- JS实现观察者模式
- js观察者模式
- js观察者模式
- js观察者模式
- js观察者模式2
- js实现观察者模式
- 开博序
- 从U盘上安装ubuntu
- C++ 中关于文件的读入和输出
- weblogic 集群介绍
- Eclipse plugin开发总结
- 观察者模式js讲解实例(转)
- mac如何共享文件
- 写容易调试的代码程序
- 精选最新优秀源码下载网站排行
- 光栅图形学之直线段扫描算法(DDA)
- 对工作的理解
- 我的家家
- Linux最近常用命令
- 堆和栈的区别(被转了无数次的好文章)