1. 估計很多人都會用到jQuery中的each方法。
那就來看一看jQuery都干了些什么。
找到jquery中的each源碼：
each: function( object, callback, args ) {
var name, i = 0,
length = object.length,
isObj = length === undefined || jQuery.isFunction( object );
if ( args ) {
if ( isObj ) {
for ( name in object ) {
if ( callback.apply( object[ name ], args ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.apply( object[ i++ ], args ) === false ) {
break;
}
}
}
// A special, fast, case for the most common use of each
} else {
if ( isObj ) {
for ( name in object ) {
if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {
break;
}
}
}
}
return object;
},
這段代碼還是比較簡單的，應該沒什么問題.
為了測試這個東西，我寫了下面一段js;
$.each($(".demo"),function(){
console.log("show");
});
然后再加一段html:
<a href="" class="demo"></a>
<a href="" class="demo"></a>
<a href="" class="demo"></a>
然后拿著jQuery的源碼來調試，以為能得到正確的結果。可是很遺憾。
可以看到，這里的object竟然不是我所想要的那三個html對象，竟然是js內置的8種數據類型。
之后在jquery的源碼中加了一段代碼:
console.log(Object.prototype.toString(object));
console.log(length);
之后的輸入如下：
也就是說在文檔加載的時候，jQuery會用each遍歷dom對象,即使沒有使用
$(function(){
});
當遍歷指定對象之后，依舊會繼續冒泡遍歷父級元素。
2. 根據jQuery的源碼使用回調函數參數
$.each($(".demo"),function(a,b){
console.log(a + "" + $(a).attr("class"));
})
從源碼可以看到:
callback.call( object[ i ], i, object[ i++ ] )
最后都將當前對象通過call方法傳遞給了回調函數，那么就可以像上面一樣去使用當前對象中的屬性。當然也可以直接用this來調用。
如果說復雜些的東西，比如，這里我是將$(".demo")作為object傳遞進去給$.each()
如里某些時候不是傳遞的jQuery或者html對象。而是一個Object或者array。
而在array中又存在很多其它的object或者方法。
這樣就能弄出更多的效果。
3. 采用call或者apply實現回調模式.
從上面的代碼可以看到：
callback.call(obj,args)
callback.apply([obj],args)
之類的代碼，這里只需要傳遞callback函數，就能實現自己調用，這對于提高代碼的復用程度用處不小。
但是也存在某些缺點，比如代碼可讀性降低，耦合程度增加等。
偶有所得，以記錄之，以防忘記！
