Javascript和Jquery中的array.eq()与array[]有何区别？

Question

当访问数组时，什么情况下适合使用.eq()函数？

例如，我有...

slides.eq(slidesLength-1).css("z-index", (slidesLength-1));

之后，我学习并掌握了IT技术......

for(i=0; i<slidesLength-1; i++) {
    $(slides[i]).css("left", "-100%");
}

在第一段代码中，如果我不使用.eq()函数，幻灯片停止工作。然而，第二段代码似乎无论是否使用.eq()函数都可以正常工作。这是为什么呢？

- Ivan Potosky

Answer 1

slides不是一个数组，而是一个jQuery对象。 .eq()方法返回指定索引处的元素作为jQuery对象。

尽管jQuery对象可能不是数组，但它们可以通过具有与索引对应的属性以及length属性来伪装成数组。(由于它们不是数组，您无法在它们上调用像.pop()、.forEach()等的方法。)

当您执行slides[i]时，实际上获取到的是DOM元素，而不是jQuery对象。 $()函数将DOM元素转换为jQuery对象。

因此，当您执行slides.eq(1)时，内部jQuery实际上是执行$(slides[i])。

P.S. 假装是数组的对象（如jQuery对象）称为“类数组对象”。如果您执行console.log(slides)，它可能看起来像一个数组。这只是您的控制台试图方便您。 (请参阅此问题获取更多信息：Creating array-like objects in JavaScript)

- gen_Eric

---

谢谢你的解释。很明显我需要进一步阅读。 - Ivan Potosky

Answer 2

.eq()是jQuery的一个方法，它返回一个jQuery对象，而通过索引访问时则返回普通DOM元素。当您想要在返回的选择上使用jQuery方法（在此情况下是css()）时，应该使用eq()。

之所以$(slides[i])起作用，是因为您通过将普通元素传递给$()构造函数来构造了一个jQuery对象。

- T J

---

谢谢。我现在明白了区别，一定会更多地阅读细微差别的相关内容。 - Ivan Potosky

Answer 3

您的slides变量不是一个Array，而是一个jQuery对象。 .eq()返回一个jQuery对象，如果index超出范围，则最终为空，并且从末尾计算负数index。 .get()返回一个DOM元素，如果index超出范围，则返回undefined，并且从末尾计算负数index。 []返回一个DOM元素，如果index超出范围，则抛出错误。

另外，jQuery方法允许您像单独使用一个元素一样与一组元素交互。所以如果您这样做：

slides.css("left", "-100%");

它应用于jQuery对象中包含的每个匹配元素。没有必要循环遍历它们。

...

另外，循环遍历匹配元素的首选方法是使用each()方法：

slides.each(function (i, el) {
    var $el = $(el);
});

同时，使用以$符号为前缀的jQuery变量是一种已经确立的惯例；这样可以轻松区分DOM元素和jQuery对象。但这只是个人口味的问题。

- Lionel Gaillard

---

好的答案...我忘记了.get()方法! - gen_Eric

注意：如果在 jQuery 对象上调用 .get() 而没有参数，则会返回一个实际的数组（包含 DOM 元素或 jQuery 对象中的任何内容）。 - gen_Eric

感谢您的详细回复。我会将您的答案整合到我的代码中。 - Ivan Potosky

好的，现在我正在使用for循环，你建议使用.each()函数。.each()函数能否针对jQuery对象中除一个元素之外的所有元素？ - Ivan Potosky