こんにちは、kintoneを作っているエンジニアの佐藤鉄平(@teppeis)です。先日10/24に発売されたWEB+DB PRESS Vol.71のJavaScript連載で「プログラマのためのjQuery再入門」という記事を書かせて頂きました。
ワンランク上のjQuery使いを目指す方のために、こんな内容になっています。
- パフォーマンスアップの秘訣
- Sizzleの仕組みとセレクタの高速化
- on/offによる新しいイベント制御API
- Deferredを使った非同期処理
最新版の1.8.2をもとに書いたので、1.4あたりでjQueryに入門した方の知識のブラッシュアップにもオススメです。是非ご覧ください。
これでもう「jQueryは甘え」なんて言わせません！
jQuery 1.9で削除されるかもしれないAPIたち
さて、jQueryの次期バージョン1.9が来年前半に計画されています。 1.9ではコードのクリーンナップのため、多くのdeprecatedなAPIが削除される予定になっています。ちょっと気が早いですが、スムーズに移行するためにdeprecatedなAPIとその修正方法を確認してみます。（注：すべてのdeprecatedなAPIが1.9で削除されると決まったわけではありません）
$.browser
古くからあるブラウザ判定用のプロパティです。
長らくdeprecatedのまま残されていましたが、ようやく1.9で削除されることが予告されました。$.browserのようなUserAgentからブラウザを判定して分岐を行う "Browser detect" は、未知のブラウザに対応することができません。可能であれば利用したい機能のサポートを検出する "Feature detect" に置き換えるのが良いでしょう。Modernizr を使うとそのような機能検出がJSからもCSSからも簡単にできるようになるのでオススメです。
.size()
セレクタで選択した要素数を取得するメソッドです。 これはまだ使っている方も多いのではないでしょうか？現在はdeprecatedなので、lengthプロパティに置き換えましょう。
$.sub()
jQueryオブジェクトのコピーを作るメソッドです。 これはほとんど使われているのを見たことがないですね。必要であればcompatibilityプラグイン（削除されたAPIは互換性のためにプラグインとして提供される予定です）を利用することになりそうです。
.live() / .die()
.live()は特定のセレクタで発生したイベントに対するハンドラを登録するメソッドです。 .live()はdocument内の全てのDOM要素で発生したイベントを拾ってしまい効率が悪いので、適切な親要素に対する.delegate()に置き換えましょう。 このあたりは新しいイベント制御APIのon/offメソッドも含めて冒頭のWEB+DB PRESS誌内でも紹介していますので、ご興味のある方はそちらもご覧下さい。
:checkbox などのフォーム系拡張セレクタ
フォーム系要素を選択するためのjQuery独自拡張セレクタです。 これらはブラウザネイティブのquerySelectorAllメソッドではサポートされないセレクタのため、実行速度が低速になります。
- :checkbox
- :password
- :radio
- :reset
- :submit
- :text
- :file
- :image
- :input
- :button
これらは[type="checkbox"]のようなquerySelectorAllメソッドでサポートされるセレクタに置き換えることができます。
ただし、:inputと:buttonは仕様上の問題で単純な置換えはできないため、HTML構造やロジックを見直す必要があります。
jqXHR.success() / .error() / .complete()
$.get()などAjax系メソッドが返すjqXHRオブジェクトのコールバック登録メソッドです。 jqXHR専用の特殊なメソッド名(success/error/complete)ではなく、現在ではDeferredオブジェクトの一般的なメソッド名(done/fail/always)を使うことが推奨されるようになりました。
いかがでしたか？まだ使っているAPIはありましたか？ 来たるべきときに備えて、deprecatedなAPIには気をつけてコーディングしていきましょー！
