jQuery迭代器

http://www.imooc.com/code/3417

迭代器

迭代器是一個框架的重要設計。我們經常需要提供一種方法順序用來處理聚合對象中各個元素，而又不暴露該對象的內部，這也是設計模式中的迭代器模式(Iterator)。

jQuery中的$.each方法就是一個典型的迭代器，通過each我們可以傳入額外的function，然后來對所有的item項進行迭代操作，如下代碼：

$.each([52, 97], function(index, value) {
  alert(index + ': ' + value);
});
$( "li" ).each(function( index ) {
  console.log( index + ": "" + $(this).text() );
});

針對迭代器，這里有幾個特點：

☑ 訪問一個聚合對象的內容而無需暴露它的內部。

☑ 為遍歷不同的集合結構提供一個統一的接口，從而支持同樣的算法在不同的集合結構上進行操作。

☑ 遍歷的同時更改迭代器所在的集合結構可能會導致問題。

簡單的說：封裝實現，然后迭代器的聚合對象不用關心迭代的過程，從而符合SRP原則。

jQuery源碼：靜態方法

// args is for internal usage only,

//並沒有操作過obj。所以obj是不變的

 each: function( obj, callback, args ) {
       var value,
            i = 0,
            length = obj.length,
            isArray = isArraylike( obj );//類數組的判斷$("li")

if ( args ) {
            if ( isArray ) {
                for ( ; i < length; i++ ) {
                    value = callback.apply( obj[ i ], args );//apply后面的參數得是個數組
                    if ( value === false ) {//所以在$.each里我們用return false跳出循環
                        break;
                    }
                }
            } else {
                for ( i in obj ) {
                    value = callback.apply( obj[ i ], args );

                    if ( value === false ) {
                        break;
                    }
                }
            }

        // A special, fast, case for the most common use of each
        } else {
            if ( isArray ) {
                for ( ; i < length; i++ ) {
                    value = callback.call( obj[ i ], i, obj[ i ] );

                    if ( value === false ) {
                        break;
                    }
                }
            } else {
                for ( i in obj ) {
                    value = callback.call( obj[ i ], i, obj[ i ] );

                    if ( value === false ) {
                        break;
                    }
                }
            }
        }

        return obj;
    }

 實例方法：

each: function( callback, args ) {
        return jQuery.each( this, callback, args );
    }

 jQuery的實例方法最終也是調用的靜態方法，我們在之前就解釋過jQuery的實例與原型方法共享的設計。