細かすぎて伝わらないjQuery拡張 (15) “$.rebase” – Advent Calendar 2016
この記事は賞味期限切れです。(更新から1年が経過しています)
$.rebase は、オブジェクトに属しているメソッドをそのオブジェクトに bind するための関数です。 bind するメソッド名をパターンで渡すことができます。
$.rebase(obj, pattern)
使い方
var obj = {
_onTest: function(){
console.log(this === obj);
}
};
// setTimeout のコールバック内の this は window になります
setTimeout(obj._onTest, 0); // => false
$.rebase(obj);
// this が obj に固定されます
setTimeout(obj._onTest, 0); // => true
第二引数で、bindするメソッドの名前のパターンを指定できます。 デフォルトでは /^_[a-z]/ です。
var obj = {
fooBarBaz: function(){ ... }
};
// パターンを正規表現文字列か、RegExpオブジェクトで渡す
$.rebase(obj, /^foo/);
DOMのイベントリスナー登録での使用例
この関数はとても良く使っています。 クラスライクにコードを書く事が多いのですが、インスタンスメソッドをDOMのイベントリスナーに登録する時など、 bind されてあると this でインスタンスが参照できるのでとてもはかどります。
var MyApp = function(selector){
$.rebase(this);
this.el = $(selector);
this.el.on("click", this._onClickTest);
};
MyApp.prototype.el = null;
MyApp.prototype._onClickTest = function(){
// ここの this はインスタンス(app)に固定されている
};
var app = new MyApp("#test");
コード
$.rebase = function(obj, pattern){
pattern = pattern || /^_[a-z]/;
pattern = ($.type(pattern) !== "regexp") ? new RegExp(pattern) : pattern;
$.each(obj, function(key, value){
if(pattern.test(key) && $.isFunction(value)){
obj[key] = value.bind(obj);
}
});
return obj;
};
コメント