ホームページ  >  記事  >  ウェブフロントエンド  >  Javascript パターンの例 オブザーバーのパターン_JavaScript スキル

Javascript パターンの例 オブザーバーのパターン_JavaScript スキル

WBOY
WBOYオリジナル
2016-05-16 18:43:35898ブラウズ

これらの記事を書いている素晴らしい人はたくさんいますが、その例のほとんどは .NET です。今日は JS の使用例を示したいと思います。興味のある友人は、まず、李輝君兄弟のデザインパターンの章のオブザーバーセクションなど、素晴らしい人々について知ることができます
http://www.cnblogs.com/Terrylee/archive/2006/ 10 /23/Observer_Pattern.html
このパターンについての私自身の理解を話させてください。中心的な考え方は次のとおりです。観測される各オブジェクトはオブジェクト データの変化に従って変化し、観測されるオブジェクトは存在する必要があります。は、制約する変更動作と同じです。この制約は、観察対象オブジェクトによって観察者に提供される統一インターフェイスです。観察者はデータを変更する動作を開発します。

JS は弱い型指定のスクリプトであり、インターフェイスの制約がある .NET とは異なり、多くの点に同意する必要があります。これ以上は説明せずに、例を直接見てみましょう:
オブザーバー インスタンス

コードをコピーします コードは次のとおりです:

var ObserverObj = { /**//*依存オブジェクト*/
名 : "Max",
姓: "Gan",
ID: 1
}
var ObserverManager = { /**//*オブザーバー*/
オブザーバー:[], /** //*観測オブジェクトセット*/
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
var item = this.Observers[i]; //オブジェクトの後変更、観測オブジェクトの変更 Display の動作は統一インターフェイスです。
}
}
}
var Header = function(){ /**//*観測オブジェクトのヘッダー*/
this。 Display = function(){
alert(ObserverObj.FirstName);
}
}
var Content = function(){ /**//*オブジェクトの内容を観察する*/
this.Display = function (){
alert (ObserverObj.LastName);
}
}
var Foot = function(){ /**//*観測対象 足*/
this.Display = function(){
alert(ObserverObj. Id);
}
}

上記の例では、Binding メソッド (AddObserver) のみが提供されています。皆さんちょっと考えてみれば分かりますよ。実際、これらのコードの最終的な目的は、オブザーバーのデータが変更されると、他のオブジェクトもデータの変更に応じて応答することです。 OK、ではバインドしましょう。

コードをコピー コードは次のとおりです:
/***バインドオブザーバーアクション***/
ObserverManager.AddObserver(new Header());
ObserverManager.AddObserver(new Foot());結局毛糸使うの? (愚かな質問です...笑) 例を見てください。
使い方



コードをコピーします
コードは次のとおりです。次のように: 名を変更 姓を変更< ;/a>


サンプル全体を添付します。興味のある友人はダウンロードして見てください。

JavaScript Observer Mode.rar
人がどこまで行けるかは、誰と一緒に旅行するかによって決まります