イベントハンドリングなら handleEvent を使えば、Function#bind や $.proxy はたぶん要らない
タイトル変えました
uupaa.js の個々の機能をちょっとずつ紹介しています。
h2ham さんの記事を拝見して
http://h2ham.seesaa.net/article/142734325.html
uupaa.js では、 クラスオブジェクトの handleEvent にイベントを束縛できるため、
jQuery の、この(↓)ようなコードは
$(function() { var obj01 = { somevar : 'jQuery', doSomething : function() { alert(this.somevar); // alert( "jQuery" ) } }; $('button#test02').click($.proxy(obj01.doSomething, obj01)); // ココ!! });
uupaa.js だと、この(↓)ように記述できます。
uu.ready(function(uu) { var obj01 = { somevar : 'uupaa.js', handleEvent: function(event) { alert(this.somevar); // alert( "uupaa.js" ) } }; uu('button#test02').click(obj01); // ココ!! });
もう一歩進んで、しっかり書くとなると、こう(↓)なるでしょうか。
uu.ready(function(uu) { uu.Class.singleton("Object1", { somevar: "uupaa.js - ClassObject", handleEvent: function(event) { // ココ!! alert(this.somevar); // alert( "uupaa.js - ClassObject" ) } }); uu('button#test02').click(uu("Object1")); // ココ!! });
USE MESSAGE
イベントではなく、uupaa.js のメッセージングでこの(↓)ように代用することもできます。
# uu().post() は近々追加される予定の機能です。
<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8" /> <title></title> <script src="uupaa.js"></script> <script> uu.ready(function(uu) { uu.Class.singleton("Object1", { ident: "uupaa.js - ClassObject", handleEvent: function(event) { // DOMイベントハンドラ alert(this.ident); }, msgbox: function(msg, param1, param2) { // メッセージボックス(引数を2つまで渡せる, 型は自由) alert(this.ident); return "hello"; // uu.msg.send() なら値を返せる } }); uu('button#test02').click(uu("Object1")); // クリックイベントをDOM Event経由で通知 uu('button#test02').post(uu("Object1")); // クリックイベントをメッセージング経由で通知 }); </script> </head><body> <button id="test02">click me!</button> </body></html>
handleEvent は DOM 標準の機能
handleEvent は DOM 標準の機能です。
例により、handleEvent によるイベントハンドリングは IE8以下で利用できないため、そのへんは uupaa.js がちょっとだけ面倒をみています。
メッセージング は uupaa.js の機能
handleEvent はそもそもイベント用なので(カスタムイベントを作れば handleEvent をイベント以外でも使えるけど)、イベント以外の通知を行うメッセージングという仕組みが uupaa.js にはあります。
uupaa.js のメッセージングは postMessage() メソッドと名前が似ていますが、ちょっと違う機能(クラスオブジェクトに、ユニ/マルチ/ブロードキャストや同期/非同期通信が可能)です。
イベントとメッセージングは責務/用途で棲み分けがされていますが、メッセージングは多機能かつ値も渡せる/返せるため、カスタムイベントで無理やりシステムっぽい事をするよりも、自然にコーディングできます。
まとめ
えーと、イベントハンドリングに関しては、Function#bind や $.proxy() でゴニョゴニョせず、 handleEvent ベースで思考すると JavaScript をもっと楽しめると思います。
IE以外ならDOM標準の機能を使うため、内部で余計なクロージャを何個も作ったりせずにすみますし、JavaScript に限らず、イベントハンドリング周りはボトルネックになりがちなので、本来はできるだけ軽く仕上げなきゃだめな部分です。
おまけ
mousemove や touchmove を $.proxy でハンドリングした場合と、uupaa.js の handleEvent でハンドリングした場合のベンチをだれかがやってくれることを期待。