$.eachのループを途中で止める (軽めのjQuery Advent Calendar 2012 7th day)
Posted: Updated:
$.eachを回して途中で止める
$.eachはたとえば複数の要素を示すjQueryオブジェクトをループして、ひとつひとつに対して処理を適用することができます。jQueryプラグインなぞを開くと、かなりの高確率で使用されている人気のAPIです。
そんな$.eachは、return falseでいわゆるbreak（中断）をすることができます。知ってると便利かも、ぐらいの軽いおはなし。
- orange
- pineapple
- apple
たとえばこのようなコードでは、orange・pineapple・appleの順に並んだ要素をループして検査し、pineappleであれば、ループを止めてそうでなければ背景に色をつけています。この例で期待される動作は、最初のorangeだけに色がつくのが正しいです。
実行結果は以下
こんな感じになります。期待通りの動作ですね。
do Zepto？
比較対象にZepto.jsを出してみました。do Zeptoをすると、同じ処理をZeptoで行います。
Zepto.jsは、jQueryとほとんど同じAPIをもった軽量互換ライブラリです
挙動が違うのが分かるでしょうか？ jQueryがreturn falseで中断されるのに対して、Zeptoはreturn trueだろうとreturn falseだろうと、途中でreturnしたときは単純に次のループに進みます。
これはjqMobiも同様で、jQuery互換ライブラリを標榜する連中が、実はてきとーなところで互換性を端折っている典型例でしょう。
おしまい
途中で寄り道しちゃいましたが、広義のjQueryということで！
以上、軽めのjQuery Advent Calendar 2012の7日目でした〜。
