おひさしぶりです。
いまだに朝がレッドブル＆コーヒーな堀川です。
今回もjavascriptのお話です。
jQueryを使っていて、以前、困った事がありました。
jQueryオブジェクトを変数に格納して使うことはよくありますよね。
var aaa = $("bbb");
みたいな感じです。
でもこれ、本当にたまにですけど、様々な処理をおこなっていくと、
原因はjQueryではなく、コードを書く側の問題だとは思いますが、
aaa と $("bbb") が一致しなくなる時があるんですよね。
特に、変数内のDOM要素を頻繁にいじる時とか。
この不一致が起こって、原因の箇所の特定がとにかく大変だったことをおぼえています。
すべての人がjavascriptに精通しているわけでもないし、
できることならば簡単にこの問題を解決したい。
そんなわけで以下のような関数を用意してみました。
----------------------------------------
//今回用意した関数
//クロージャを使ってみる
function fn$(selector){
return function(){
return $(selector);
};
}
//変数宣言
var aaa = fn$("bbb");
//イベント等の実際の処理
aaa().click(function(){
});
----------------------------------------
メリットとデメリットは以下のような感じでしょうか。
■メリット
- aaa != $("bbb") となる現象を意識せずにコードを書ける
- 毎回$("bbb")のと変わらないが、宣言箇所にセレクタをまとめられるので修正が楽
- 変数に格納するのと同じ感覚で使用できる
■デメリット
- 毎回$("bbb")をしているのと変わらないので速度的に遅くなる
デメリットは、まあ、超高速なスクリプトを！なんて要求もそうそうないでしょうし、
最低でもIDでセレクタ指定するとか、ルールを設ければクリアできるはず。
これを使うのが正しいかどうかはわかりませんが、
ひとつの考え方として、役に立つことがあればと思います。
以上、堀川でした。
- Taro Horikawa
- Works
- ―
