Skip to content

hifiveのイベント通知機能を使おう

by : 2017/09/05

Webシステムの開発時においてイベント通知はよく使われます。例えばjQueryでボタンを押した時のイベントは次のように設定されます。

こうした通知機能を任意のオブジェクトに追加できるのがhifiveのイベント通知機能になります。今回はその基本的な実装方法について紹介します。

mixを使う

まずオブジェクトに対して eventDispatcher を追加します。これは Prototype に対して追加します。

次にそのオブジェクトのインスタンスを作ります。

この時点でインスタンスに対して addEventListener / removeEventListener が追加されています。通知を受け取るイベント名を設定し、その後実行する処理内容を記述します。

後は任意のタイミングで dispatchEvent を実行します。typeとしてイベントの名前、後は任意のハッシュキーでデータを送れます。

イベント通知は複数の関数を設定できます。イベント通知、いわゆるPubSub型であればオブジェクト側では処理した後に何の関数を呼び出すかといった意識をする必要がありません。各クラスのメソッドに追加しておくことで、オブジェクト間の通信がスムーズになることでしょう。

今回のコードはJSFiddleにアップロードしてあります。実装時の参考にしてください。

From → hifive

コメントする

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。