[JavaScript]カスタムイベントについて

ASではイベント駆動のコードを書いていたので、JSでもイベント駆動のコードが書きたいなぁ。

っと思っていたら早速引っ掛かったのでちょっとメモです。

addEventListenerを二重で書いても一つしか登録されない

AS3は同じイベント、同じリスナーでaddEventListenerを二つ記述すると、dispatchEventの際に2回処理が実行されていましたが、JSは二重登録されていない様です。

var e = document.createElement('div');
var a = function(){console.log('aaa');};
e.removeEventListener('test',a); //エラー発生せず
e.dispatchEvent(new Event('test')); //「a」は処理されず
e.addEventListener('test',a); //ひとつめのイベント登録
e.dispatchEvent(new Event('test')); //「a」が処理されコンソールに一度だけ「aaa」を出力
e.addEventListener('test',a); //ふたつめのイベント登録
e.dispatchEvent(new Event('test')); //「a」が処理されコンソールに一度だけ「aaa」を出力
e.removeEventListener('test',a); //イベントリスナー削除
e.dispatchEvent(new Event('test')); //「a」は処理されず

っとなると、addEventListenerをする際に、毎回removeEventListenerする必要が無いって事ですね。

document.dispatchEventは存在しない

documentにaddEventListenerをする事はできるのですが、documentでdispatchEventをする事はできませんでした。

カスタムイベントを使用する場合は、エレメントにaddEvenetListenerする必要がある様です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>