JSLintは使おう
「閉じ括弧が抜けている」とかのクソエラーを実行前に見つけてくれる
関数内の定義順
- プライベートプロパティ
- プライベート関数
- 処理
//プライベートプロパティ //メッセージ var msg = 'hello', //プライベート関数 //メッセージを表示 show = function () { window.alert(msg); }; //処理 show();
長い匿名関数に名前を付ける
15行超えたら一回しか使わなくても名前を付ける
高階関数でラップしてコンテキストを渡す。
var show = function (msg) { return function (event) { window.alert($(msg + event.target).val()); } } $(':text').on('blur', show('welcome! '));
オブジェクト返すときはreturn{ hoge: hoge }
事前にオブジェクトを作らない
どこで何を入れているのか分からなくなる
require.jsのモジュールの実行順序を指定するときは関数を返す
利用側で関数を呼べば各自に制御できる
define([], function () { return function () { //初期化処理 }; }); define(['init1', 'init2'], function (init1, init2) { init1(); init2(); });
嘘かな?というか違う方法の方がよさげ。
依存モジュールの取り込みが終わるまでは実行されないので、それを活用する、とか?
jQuery.validation plugin に対する愚痴
- メソッド名がいまいち。validateメソッドが初期化で、formメソッドがform単位のバリデーション実行で、elementメソッドが要素単位のバリデーション実行
- validateメソッドに渡していいのはformだけ、ほかのを入れるとバリデーション実行時にエラーが起きる
- checkメソッドはtrue/false以外も返してくる。必須でない要素が空の時はundefinedを返す
- 決まった要素しか監視しない。しかし、そのセレクターは外部に公開されていない
- 初期値が入っているとrequiredが効かない
- changeイベントは監視しない。datepickerで値を入れても反応しない
- バリデーション状態が変わってもイベントを投げてくれない
- 二回初期化するとオプションが初期化される。メッセージが英語になったり
- エラーラベルは最初に表示するときに追加して、非表示にするときは削除じゃなくて非表示にする。(これはただのメモ)
IE9のpasteイベントでキャレット(カーソル)位置を設定しても反映されない
keyupイベントなら反映される
ペースト実行時に値を変更するとキャレットが最後に移動する。
元の位置に戻そうとしても反映されない。
callの置き換え
this参照を引数参照に置き換えればcallは無くせる。
イベントハンドラーに使わないならcallは無い方が美しい。
(function (){ alert($(this).val) }).call($hoge);
(function (target){ alert($(target).val) })($hoge);