jQuery源码学习 之 仿栈与队列操作

1. 理解

jQuery既然是模仿的数组结构，那么肯定会实现一套类数组的处理方法，比如常见的栈与队列操作push、pop、shift、unshift、求和、循环遍历each、排序及筛选等一系列的扩展方法。

jQuery对象栈是一个便于DOM查找提供的一系列方法，jQuery可以是集合元素，提供了.get()、:index()、:lt()、:gt()、:even()及:odd()这类索引相关的选择器，作用是过滤他们前面的匹配表达式的集合元素，筛选的依据就是这个元素在原先匹配集合中的顺序。

2. 实现原理

get方法：通过检索匹配jQuery对象得到对应的DOM元素，实现如下：

get: function(num) {
  return num != null ? 
  // Return just the one element from the set
  (num < 0 ? this[num+this.length] : this[num]) :
  // Return all the elements in a clean array
  slice.call(this);
}

原理为jQuery查询出来的是一个数组的DOM集合，所以就可以按照数组的方法通过下标的索引取值，当然如果num的值超出范围，比如小于元素数量的负数或等于或大于元素的数量的数，那么它将返回undefined。假如页面上有一个简单的无序列表，如下代码：

<ul>
  <li id="foo">foo</li>
  <li id="bar">bar</li>
</ul>

如果指定了index参数，.get()则会获取单个元素，如下代码：

console.log( $("li").get(0) );

由于索引index是0,开始计数，所以上面代码返回了第一个列表项<li id="foo">foo</li>、

然而，这种语法缺少某些.get()所具有的附加功能，比如可以指定索引值为负值：

console.log( $("li").get(-1) );

负的索引值表示从匹配的集合中从末尾开始倒数，所以，上面这个例子将会返回列表中最后一项：<li id="bar">bar</li>。

由于是数组的关系，所以我们有几个快捷的方法，如头跟尾的取值：

first: function() {
  return this.eq(0);
},
last: function() {
  return this.eq(-1);
},