◆ シンプルなものを作ってみました 

イベントエミッターっていいですよね

JavaScriptでなにか作ってるときに デザイン処理と内部的ないかにもプログラムっぽい処理がところどころ混ざってきますよね
デザイン的な部分で 表示切り替えたらそれに合わせて 内部的な処理も更新するとか そういうのです

そのときに デザイン側から内部処理ぽい関数を呼ぶのもなんか嫌ですし もし2人で作っていたりすると 気軽に関数名変えたり出来ないですし ファイルが別になってると特にそういうのに抵抗があります
(いい言葉がでてこなくて自分でもイメージがつかめない表現です)


いい感じに書く方法ないかなーっと方法を考えていると Nodejs にある EventEmitter がすごくよさそうです

例えば ボックスを非表示にしたら "box-close" というイベントを発火させます
内部的な処理するところでは 必要ならデザイン系な操作で起きる "box-close" のようなイベントに対して イベントにリスナを付けておきます
必要がなければ イベントが起きても何もしないだけですし 関数を別のものにしたいときは リスナ登録してるところでイベント名に対応する関数名を書き換えるだけで済みます
内部処理側だけのコードで完結できて デザイン側ソースまで修正不要になります

ブラウザJSにイベントエミッター?

イベントエミッターがいいなと思ったことは いいんですが ブラウザ側で見たことないです
カスタムイベントというのは見たことがありますが あれは DOMに関係しすぎていて イベントエミッターみたいに簡単に使えるものじゃなかったと思います

ないならつくるか!

イベントエミッターの機能ってすごくシンプルで 作ろうとすれば簡単にできそうです
Nodejs のパッケージでは EventEmitter2 や EventEmitter3 があるみたいですし 探せばブラウザ版のライブラリもあるかもですが 余計な機能はない本当にシンプルなものでいいのでサッと自作してみました

インスタンスなんていらない グローバルに1つあればいい人向け
window.ee = {
listeners: {},
on: function(evname, evaction){
this.listeners[evname] = evaction
},
emit: function(evname /*, evargs */){
this.listeners[evname] && this.listeners[evname].apply(null, [].slice.call(arguments, 1))
}
}

インスタンス作りたい人向け
function EvEmitter(){
this.listeners = {}
}
EvEmitter.prototype.on = function(evname, evaction){
this.listeners[evname] = evaction
}
EvEmitter.prototype.emit = function(evname /*, evargs */){
this.listeners[evname] && this.listeners[evname].apply(null, [].slice.call(arguments, 1))
}

1イベント1リスナだけ しかも消すことはできない というシンプルなものです

実際使ってるとコレで十分なことが多いですよね
ただ 作ってるとどうせなら高機能にとか思ってしまって高機能版もできてしまいました
気になる人はこちらへどうぞ
http://var.blog.jp/archives/46700062.html

ところで イベント系ってディスパッチやファイアー(発火)やエミットなど色々同じような言葉ありますがなんでこんなにあるのでしょう
どれも同じような使い方されてますし統一すればいいのに