jQuery源码研究：jQuery原型对象上的属性方法(下)
jQuery源码研究：jQuery原型对象上的属性方法(下)
接昨天的jQuery原型属性方法部分。
each()方法：为每个匹配的元素集合执行回调函数，是一个jQuery版的遍历方法。
jQuery.prototype = {
each: function(callback) {
return jQuery.each(this, callback)
}
}
//demo.html
<body>
<ul>
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>
</body>
$('li').each(function(i, v){
console.log(i); //索引
console.log(v); //第n个元素
})
注意，$('li')是jQuery构造函数的实例对象，凡是jQuery对象原型上的方法，在实例对象中都可以被访问到的。这个each()方法其实通过返回真实的each方法的引用来实现的，具体在后面读到jQuery.extend属性时再看。
map()方法，同样也是一个遍历方法。
jQuery.prototype = {
map: function( callback ) {
return this.pushStack( jQuery.map( this, function( elem, i ) {
return callback.call( elem, i, elem );
} ) );
},
}
注意，该方法是返回一个通过调用原型方法pushStack来创建的一个新的元素集合，这样就能明白为什么API文档上说，map方法是返回一个包含返回值的新的jQuery对象了吧。至于this.pushStack()方法中的参数，可以明显看到它是jQuery构造对象上定义了一个方法map，该方法内部具体实现尚未可知，因为还没读到那部分，但看参数传递可以大概知道，将新创建的元素集合和对新集合进行处理的回调函数传入进去了。至于回调函数中，是通过call方法来调用用户定义并传入的回调函数，再将这个内部回调函数处理后的结果返回出来。这个思想很优雅~~~~
slice()方法：它的作用就是切割出一个新的类数组结果，却不会影响到原有数组值，注意，这里也是返回一个新的值，同样，也是用到了pushStack方法。
jQuery.prototype = {
slice: function(){
return this.pushStack(slce.apply(this, arguments))
}
}
console.log($('li'));
var res = $('li').slice(1,2);
console.log(res);
//打印结果
//$('li')依然是有4个li和若干属性方法组成的jQuery对象集合，而res则是只有一个索引为1的li及其他属性方法组成的`jQuery`对象集合。
//两者是完全不相干的对象。
看到没，返回的依然是一个新的通过pushStack创建的jQuery对象集合，这个方法传入的参数其实就是通过apply调用的数组的slice分割方法，对slice方法不熟的，可以看下官方API文档，唔，反正我老把slice和splice傻傻分不清楚，老要查文档。
接下来看first()和last()两个方法，它们原理一样，所以放在一起说了：
jQuery.prototype = {
first: function() {
return this.eq( 0 );
},
last: function() {
return this.eq( -1 );
},
}
都是调用的jQuery原型对象上的eq()方法，传入元素索引即可。
而它们所用的eq()方法，其实现代码如下：
jQuery.prototype = {
eq:function(i){
var len = this.length,
j = +i + (i<0?len:0);
return this.pushStack(j>=0&&j<len?[this[j]]:[])
}
}
其也是用到pushStack方法，所以可知first、last和eq方法的返回值都是新的值。注意，在计算j的值的表达示右边中，有个+i，其作用是：当i大于0时无效，但当i小于0时，就会用len-i计算出索引值，这是符合js官方数组索引计算规则的。
最后个end()方法，其功能解释API上说：结束当前链条中的最近的筛选操作，并将匹配元素集还原为之前的状态。说的不太让人懂，虽然用也会用，不就是在jQuery实例对象进行DOM选择链条中返回未选状态么，但其实看代码实现更明确：
jQuery.prototype = {
end: function(){
return this.prevObject || this.constructor();
}
}
//示例：
$('ul').find('li').end().find('li');
返回的就是选择器最初状态，能够在同一个链条上对当前筛选状态进行回退初始状态后再继续进行其他筛选操作。
Done.