array.eq() vs. tablica [] w JavaScript i Jquery

Question

Podczas uzyskiwania dostępu do tablicy, kiedy jest właściwe korzystanie z funkcji .eq()?

Na przykład, mam ...

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

a później mam ...

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

W pierwszym kawałkiem kodu, pokaz slajdów przestanie działać, jeśli Dona użyć. Funkcja eq(). Jednak drugi element wydaje się działać niezależnie od tego, czy używam funkcji .eq() czy nie. Dlaczego to?

Answer 1

slides to nie tablica. To obiekt jQuery. Metoda .eq() zwraca element z określonego indeksu jako obiekt jQuery o numerze .

Gdy przedmioty jQuery może być tablice mogą udaje się poprzez właściwość length jak również właściwości odpowiadających pozycjach. (Ponieważ nie są macierze, nie można wywołać metody jak .pop(), .forEach() itp na nich.)

Kiedy robisz slides[i], w rzeczywistości coraz element DOM, a nie obiekt jQuery. Funkcja $() przekształca element DOM w obiekt jQuery.

Tak więc, gdy robisz slides.eq(1), wewnętrznie jQuery robi $(slides[i]).

P.S. Obiekty, takie jak obiekty jQuery, które udają tablice, nazywane są "obiektami podobnymi do tablicy". Jeśli jesteś console.log(slides), może wyglądać jak tablica. To tylko twoja konsola próbująca uczynić rzeczy wygodnymi dla ciebie. (Zobacz to pytanie, aby uzyskać więcej informacji: Creating array-like objects in JavaScript)

Answer 2

.eq() to metoda jQuery, która zwraca obiekt jQuery, a dostęp do indeksu zwraca zwykły element DOM. Powinieneś użyć eq(), gdy chcesz użyć metod jQuery (css() w tym przypadku) na zwróconym zaznaczeniu.

Powód: $(slides[i]) działa, ponieważ konstruujesz obiekt jQuery, przekazując element plain do konstruktora $().

Answer 3

Twoja zmienna slides nie jest obiektem o nazwie jQuery.

.eq() zwraca obiekt jQuery, ostatecznie pusty, jeśli index jest poza zakresem, a ujemny index jest liczony od końca.

.get() zwraca element DOM lub undefined jeśli index jest poza boiskiem, a ujemny index liczony jest od końca.

[] zwraca element DOM lub wygeneruje błąd, jeśli index jest poza zakresem.

...

Dodatkowo, metody jQuery pozwalają na interakcję z zestawem elementów, tak jak to było w pojedynkę. Jeśli tak, to:

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

Stosuje się do każdego dopasowanego elementu zawartego w obiekcie jQuery. Nie trzeba ich pętać.

...

także preferowany sposób pętli w stosunku do odpowiednich elementów jest za pomocą metody each():

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

...

Ponadto jest on założony konwencja prefiks zmienne jQuery ze znakiem $; pozwala łatwo odróżnić elementy DOM od obiektów jQuery. Ale to tylko kwestia gustu.