jQ基礎編--each()の使用と実現

each()法はDOMサイクル構造を簡潔にし,誤りを生じにくい.each()関数は非常に強力な遍歴機能をカプセル化し、使用も便利で、1次元配列、多次元配列、DOM、JSONなどjavaScriptの開発過程で$eachを使用することで、私たちの作業量を大幅に軽減することができます.
次にeachのいくつかのよく使われる使い方をお話しします
each処理1次元配列

 var arr1 = [ "aaa", "bbb", "ccc" ];      
  $.each(arr1, function(i,val){      
   alert(i);   
  alert(val);
});

alert(i)は0,1,2 alert(val)はaaa,bbb,cccを出力する
each処理2 D配列

　var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]      
　　$.each(arr2, function(i, item){      
  alert(i);   
  alert(item);      
　　});  

arr 2は2次元配列であり、itemはこの2次元配列の各配列を取ることに相当する.item[0]は、各1次元配列の最初の値alert(i)に対して0,1,2に出力されます.この2次元配列には3つの配列要素alert(item)が含まれているため、出力は['a','aaa','aaa'],['b','bbb'],['bb'],['c','cc','ccc']になります.
この2ビット配列の処理を少し変更した後

 var arr = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]      
 　　$.each(arr, function(i, item){      
      　　$.each(item,function(j,val){
       　　　　 alert(j);
        　　　　alert(val);
    　}); 
});    

alert(j)は出力を0,1,2,0,1,2,0,1,2 alert(val)は出力をa,aa,aaa,b,bb,bbb,c,cc,cccとする
eachはjsonデータを処理して、このeachは更にひどくて、すべての属性を循環することができます
　　var obj = { one:1, two:2, three:3}; 　　each(obj, function(key, val) { 　　alert(key); 　　alert(val); 　　});
ここでalert(key)はone two threealert(val)を出力し、one,1,two,2,three,3はなぜkeyが数字ではなく属性なのか、jsonフォーマット内は無秩序な属性-値のセットであり、無秩序である以上、数字は何なのか.このvalはobj[key]に等しい
eachはdom要素を処理し、ここではinputフォーム要素を例に挙げます.domにこのようなコードがあるなら

次にeachを使用します

 $.each($("input:hidden"), function(i,val){  
     alert(val);
     alert(i);
     alert(val.name);
     alert(val.value);   
 })

; では、alert(val)はフォーム要素であるため[object HTML InputElement]を出力します.alert(i)は出力を0,1,2,3 alert(val.name)とする.出力aaa,bbb,ccc,dddをthisを使用すると.nameは同じ結果alert(val.value)を出力します.この場合、出力111222333444が使用する.valueは同じ結果を出力します
上記のコードを次のように変更すると

$("input:hidden").each(function(i,val){
    alert(i);
    alert(val.name);
    alert(val.value);       
});

出力の結果が同じであることがわかりますが、二つの書き方がどこで違うのか、私もまだ分かりません.この変更を上の数段の配列に適用する操作も同様の結果を出力する.
このように,いくつかの例の実際の結果はすでに答えを得た.これ以上研究を続けても、その理由を知らないわけにはいかない.以上の例からjQueryオブジェクトとjQueryオブジェクトの両方がこの方法を実現していることが分かるが,jQueryオブジェクトに対しては,eachメソッドを単純に依頼しただけである:jQueryオブジェクトを最初のパラメータとしてjQueryのeachメソッドに渡す.
jQueryのeach実装を見て(ネットワーク抜粋)

 function (object, callback, args) {
    //        :       obj，       fn，     argsvar name, i = 0,length = object.length;
    if (args) {
        if (length == undefined) {
            for (name in object) {
                if (callback.apply(object[name], args) === false) {
                    break;
                }
            }
        } else {
            for (; i < length;) {
                if (callback.apply(object[i++], args) === false) {
                    break;
                }
            }
        }
    } else {
        if (length == undefined) {
            for (name in object) {
                if (callback.call(object[name], name, object[name]) === false) {
                    break;
                }
            }
        } else {
        for (var value = object[0]; i < length && callback.call(value, i, value) !== false; value = object[++i]) {}
        /*object[0]  jQuery       DOM  ，  for  ，
              jQuery        DOM  ，   callback.call( value,i,value);
         callback this    value  ，        ,i     ，value  DOM  ；
          callback     function(index, elem) { ... }    。
              $("...").each(function(index, elem){ ... });
        */
        }
    }
    return object;
}

jqueryは,入力された要素に基づいて自動的に判断し,判断結果に基づいてapplyかcallかの処理を行う.fnの実装では、thisポインタが配列またはオブジェクトのサブ要素を直接参照することができる.1.objオブジェクトは配列eachメソッドであり、あるサブエレメントを呼び出して返される結果がfalseになるまで、配列中性子エレメントの個々のfn関数呼び出しを行います.すなわち、提供されたfn関数を処理して、一定の条件を満たすとeachメソッド呼び出しを終了することができます.eachメソッドがargパラメータを提供する場合、fn関数呼び出しの受信パラメータはargであり、そうでない場合、サブ要素インデックス、サブ要素自体2である.objオブジェクトが配列ではないこのメソッドと1の最大の違いは,fnメソッドが戻り値を逐次考慮せずに行われることである.すなわち、objオブジェクトのすべてのプロパティは、fn関数がfalseを返してもfnメソッドによって呼び出されます.呼び出し元のパラメータは1と類似しています.