1

お世話になります。


var boxes = $('div');//複数のjQueryオブジェクト?


var numbers = [1,3,4,6,8];//配列

のふたつがある場合、
それぞれの要素に対して処理する時は、

①の場合

boxes.each(function(){})

②の場合

$.each(ary,function(){})

と書くようにと、あるテキストに書いてあったのですが、
①と②にはどのような違いがあるのですか?

1 件の回答 1

7

①は$.fn.each、②は$.eachを利用しています

$.fn.each と $.each は似ているけれど、少し違う関数です
$.fn.each は1引数(function)で、$.each は2引数(array, function)です
eachできる値も異なります

$('div').each(myFunction)
^^^^^^^^
jQueryオブジェクトのみ

$.each($('div'), myFunction)
       ^^^^^^^^
       jQueryオブジェクト or 配列

jQueryオブジェクトにeachする場合、上の2つは必ず同じ結果になるのでどちらの記述をしても問題ありません
①の記述の方が短く、jQueryオブジェクトを使っていることがわかりやすいので好まれています

配列にeachする場合、上の記述は使えませんので、必ず②の記述をする必要があります


var $myDiv1    = new jQuery('div'); // $('div') と同じ
    ^^^^^^^          ^^^^^^
    インスタンス       クラス

var $myDiv2    = new jQuery('div');
    ^^^^^^^          ^^^^^^
    インスタンス       クラス

クラスをnewするとインスタンスが生成されます
クラスとインスタンスは異なるものなので、持っているメソッドも異なります

例えば
「jQueryクラス」は html という名前のメソッドは持ちません
(typeof $.html === 'undefined')
「jQueryインスタンス」は html という名前のメソッドを持っています
(typeof $('div').html === 'function')

今回は偶然「jQueryクラス」「jQueryインスタンス」 が両方 each という名前のメソッドを持っています

①は「jQueryインスタンス」のメソッド each
②は「jQueryクラス」のメソッド each

です

一般に、jQueryクラス と jQueryインスタンス をあまり区別をせず、両方を指して「jQuery」と呼ぶこともあります
なので、「①②のどちらもjQueryのメソッドですか?」という質問は少し答えにくいのですが、①②は異なるものに所属しているので「違う」と答えるのが一般的だと思います

3
  • なるほど、明快なご回答ありがとうございます!!どちらもjQueryのメソッドなのでしょうか?
    – aqua
    Commented 2017年7月5日 11:02
  • @forest コメントへの回答を質問に追記しました
    – gocho
    Commented 2017年7月5日 11:46
  • とても明快なご回答ありがとうございます!上の配列はjQueryインスタンスではないので、①が使えないということなのですね!配列はjavascriptで扱う対象ということになるのですかね。
    – aqua
    Commented 2017年7月5日 12:28

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。