|
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
一個人能夠走多遠,取決于與誰同行
JavaScript技術:Javascript 模式實例 觀察者模式,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。