# 10: Jawna a niejawna iteracja - CSS-Tricks

Anonim

Kolejny film koncepcyjny! To „tylko jedna z tych rzeczy”, które musisz zrozumieć w jQuery. W rzeczywistości jest to trochę unikalne dla jQuery, ponieważ inne popularne biblioteki JavaScript w przeszłości nie robiły tego w ten sposób.

Omówiliśmy już dość dużo selektorów. Na przykład wiesz już, że $("p")zaznaczy wszystkie akapity na stronie. Nie tylko pierwszy, czy jakiś przypadkowy, wszystkie. Możesz sobie łatwo wyobrazić, że na stronie może znajdować się ich wiele. Teraz wyobraź sobie, co się stanie, gdy to zrobisz:

$("p").hide();

Wszystkie się ukrywają, prawda? Dobrze. Nie pierwszy czy jakiś przypadkowy, wszystkie. Ta niejawna iteracja . W tle jQuery automatycznie przechodzi przez cały zestaw znalezionych elementów i uruchamia wybraną przez Ciebie metodę. Nie musimy sami pisać pętli, aby to zrobić. Wydaje się dość oczywiste, jeśli wprowadzasz do JavaScript jest jQuery, ale wiele bibliotek w przeszłości wymagało samodzielnego zapętlania kolekcji elementów.

Jeśli chcesz, nadal możesz samodzielnie napisać pętlę. To może wyglądać tak, używając metod zapętlania jQuery:

$("p").each(function() ( $(this).hide(); ));

To prawie to samo. Niekoniecznie, ale możesz. To jest jawna iteracja .

Czasami trzeba wykonać jawną iterację. Zasadniczo, jeśli musimy uzyskać dostęp do wartości thisi zrobić z nią coś specjalnego, będziemy potrzebować naszej własnej konstrukcji pętli do pracy.

Przykładem tego screencast było zliczanie znaków w elementach listy i dołączanie ich na końcu ciągu. Będziemy do tego potrzebować wyraźnej iteracji.

Zobacz pióro 4b53b9f55662d0d26339e18277500eee autorstwa Chrisa Coyiera (@chriscoyier) na CodePen

Użyliśmy tutaj metody each () jQuery, która jest idealna do tego, czego potrzebujemy. Przydatnym elementem, który dla nas jest, jest dla nas licznik indeksowany zero dla każdej iteracji, do której możemy uzyskać dostęp w razie potrzeby.

$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2