カテゴリー別アーカイブ: Observer

jQueryでオブザーバーパターンの実装

JavaScriptは, クライアントサイドでもサーバーサイドでもイベントドリブンプログラミングがコアとなるので, 必然的にオブザーバーパターンなどGUIアプリに相性の良いデザインパターンを適用できる場面が多いと思います.

jQueryでは, そのオブザーバーパターンを簡単に実装できるメソッドが用意されています.

カスタムイベントのイベントリスナを設定可能なonメソッド (古いバージョンだとbind) とカスタムイベントを発生させるtriggerメソッドです.

jQueryによるオブザーバーパターンの雛形は以下のような感じになるでしょうか (かなり, はっしょって書いてます…).

//SubjectはObserverのリストを保持する

//Subjectごとの処理 ....

//更新をオブザーバーに通知する必要が発生
$('.observers').trigger('update');

//Observer
$('.observers').on('update', function(event) {
     //ビューの更新など
});