読者です 読者をやめる 読者になる 読者になる

console.blog(self);

技術、読んだ本、いろいろ。

「10日でおぼえるjQuery入門教室」と jQuery .find() と context selector

「10日でおぼえるjQuery入門教室」を会社にあったので読んでみた。

jQuery使い始めてけっこう経つけど、どんどん変わっている。初めて使ったときは、たぶん1.2くらいだったかな。 その時々で変更点などは確認しているけど、もう一度通して勉強しようかな、と思って読んでみた。

ものすごく流し読みしたけど、読み終えるのに3日くらい掛かった。jQuery使ったことない人が、読んで書いて試したら、1日8時間で10日間くらいかかりそう。

でもなかなかよい本だった。2013/10に出ていて、サンプルコードもモダンだし、文章も読みやすかった。ちょっとしたことだけど、サンプルで使われている比較演算子が、厳密等価演算子(===)とかだったりすると安心する。

セレクタについてあまり詳しくないので、本書のサンプルはわかりやすくてよかった。使う機会の少ないものも多いけど、もうちょっとセレクタ覚えないと…。

あと、こういう書き方知らなかった。ずっと昔からあるのに…。

jQuery( selector [, context ] )

http://api.jquery.com/jQuery/#jQuery-selector-context

こんな感じで書けるみたい。

var $books = $(".books");
var rubyBooks = $(".ruby", $books);

いつもこんな感じでfind使ってた。findより簡単に書けていいじゃん。

var $books = $(".books");
var rubyBooks = $books.find(".ruby");

同じことできるなら、パフォーマンスが気になるよねって調べてみた。たくさん出てきたけどjsPerfがわかりやすくてよかった。

自分の環境で試したら、jQueryオブジェクトをfindするのがいちばん速かった。

findのドキュメント読んだら、Selector contextはfindで実装されてるんだって。まあ、そうだよね。

Selector context is implemented with the .find() method; therefore, $( "li.item-ii" ).find( "li" ) is equivalent to $( "li", "li.item-ii" ).

http://api.jquery.com/find/

ラップしてる分、遅くなっちゃうんだろうな。ものすごく遅くなるわけではないけど、これからもfindを使っていこうかな。最新のAPI Document、もうちょっと読まないと。

10日でおぼえるjQuery入門教室 第2版
山田 祥寛
翔泳社
売り上げランキング: 55,398