jquery的each方法使用範例分享_jquery

對於jQuery對象，只是把each方法簡單的進行了委託：把jQuery對像作為第一個參數傳遞給jQuery的each方法.換句話說：jQuery提供的each方法是對參數一提供的對象的中所有的子元素逐一進行方法呼叫。而jQuery物件提供的each方法則是對jQuery內部的子元素進行逐一呼叫。

複製程式碼 程式碼如下:

jQuery.prototype.each=function( fn=function() {
 return jQuery.each( this, fn, args );
}

讓我們來看看jQuery提供的each方法的具體實現，jQuery.each(obj,fn,arg)

此方法有三個參數：進行操作的物件obj，進行操作的函數fn，函數的參數args。

讓我們根據ojb物件來討論：

1. obj物件是陣列

each方法會對數組中子元素的逐個進行fn函數調用，直至調用某個子元素返回的結果為false為止，也就是說，我們可以在提供的fn函數進行處理，使之滿足一定條件後就退出each方法呼叫。當each方法提供了arg參數時，fn函數呼叫傳入的參數為arg，否則為：子元素索引，子元素本身。

2. obj 物件不是陣列

此方法同1的最大差異是：fn方法會被逐次不考慮回傳值的進行進行。換句話說，obj物件的所有屬性都會被fn方法進行調用，即使fn函數傳回false。呼叫傳入的參數同1類似。

複製程式碼 程式碼如下:

jQuery.each=function( obj, fn obj) {
    if ( args ) {
       if ( obj.length == undefined ){
        fn.apply( obj, args );
       }else{
           for ( var i = 0, ol = obj.length; i                        break;
          }
       }
   } else {
       if ( obj.length == undefined ) {
               fn.call( obj, i, obj );
}else{
          for ( var i = 0, ol = obj.length, val = obj[0]; i        }
  }
  return obj;
} 



需要特別注意的是each方法中fn的具體呼叫方法並不是採用簡單的fn(i,val)或fn(args),而是採用了fn.call(val,i,val)或fn. apply(obj.args)的形式，這意味著，在你自己的fn的實作中，可以直接採用this指標來引用數組或是物件的子元素。這種方式是絕大多數jQuery所採用的一種實作方式。