for
Pętla z licznikiem: inicjalizacja, warunek i krok. Powtarza blok kodu, dopóki warunek jest prawdziwy.
Przykład
#for (let i = 1; i <= 3; i++) {
console.log(`Lekcja ${i}`)
}Definicja i zastosowanie
#Klasyczna pętla for ma w nawiasach trzy części oddzielone średnikami. Pierwsza wykonuje się raz na starcie i zwykle tworzy licznik. Druga to warunek sprawdzany przed każdym obrotem. Trzecia wykonuje się po każdym obrocie i zwykle zwiększa licznik.
Sprawdza się, gdy potrzebujesz indeksu, chcesz iść co kilka elementów, od końca albo tylko przez część tablicy. Jeśli po prostu przechodzisz po wszystkich elementach, czytelniejsze są for...of lub metody tablic, np. forEach() i map().
Licznik deklaruj przez let. Wtedy każdy obrót dostaje własną kopię zmiennej, a poza pętlą licznik nie istnieje. Każdą z trzech części można pominąć, ale średniki muszą zostać: for (;;) to pętla nieskończona, którą przerwiesz tylko przez break lub return.
Składnia
#for (initialization; condition; afterthought) {
// instrukcje
}Więcej przykładów
#const ranking = ['Ola', 'Ania', 'Kuba']
for (let i = 0; i < ranking.length; i++) {
console.log(`${i + 1}. ${ranking[i]}`)
}const countdown = []
for (let i = 10; i > 0; i -= 3) {
countdown.push(i)
}
console.log(countdown)for (let row = 1; row <= 3; row++) {
let line = ''
for (let col = 1; col <= 3; col++) {
line += row * col + ' '
}
console.log(line.trim())
}Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- Uważaj na warunek
i <= array.length. Indeksy kończą się nalength - 1, więc ostatni obrót odczytaundefined. Poprawnie:i < array.length. - Nie usuwaj elementów tablicy (np. przez
splice()) w trakcie przechodzenia po niej do przodu, bo łatwo pominąć kolejny element. Idź od końca albo użyjfilter(). - Jeśli indeks nie jest Ci potrzebny, wybierz
for...of. Kod jest krótszy i nie da się pomylić o jeden.
Powiązane hasła
#- for...ofPrzechodzi po kolejnych wartościach obiektu iterowalnego: tablicy, napisu, Map, Set i innych.
- whilePowtarza blok kodu, dopóki warunek jest prawdziwy. Warunek sprawdza przed każdym obrotem.
- breakNatychmiast kończy pętlę lub instrukcję switch i przechodzi do kodu, który jest za nią.
- continuePomija resztę bieżącego obrotu pętli i przechodzi od razu do następnego.
- Array.prototype.forEach()Wywołuje funkcję dla każdego elementu tablicy.
Widzisz błąd albo brakuje przykładu? Napisz do nas.