Lekcja 5: Pętle

Pętle pozwalają na wielokrotne wykonywanie bloku kodu, dopóki określony warunek jest spełniony lub dla każdego elementu w kolekcji. Są niezbędne do automatyzacji powtarzalnych zadań.

Pętla `for`

Najczęściej używana pętla, idealna, gdy znamy liczbę powtórzeń lub chcemy iterować w określonym zakresie.

for (inicjalizacja; warunek; inkrementacja/dekrementacja) {
    // Kod do wykonania w każdej iteracji
}

• Inicjalizacja: Wykonywana raz na początku pętli (np. let i = 0).
• Warunek: Sprawdzany przed każdą iteracją. Jeśli jest prawdziwy, pętla kontynuuje; jeśli fałszywy, pętla kończy się.
• Inkrementacja/Dekrementacja: Wykonywana na końcu każdej iteracji (np. i++).

// Wyświetlenie liczb od 0 do 4
for (let i = 0; i < 5; i++) {
    console.log("Iteracja numer:", i);
}
// Wynik:
// Iteracja numer: 0
// Iteracja numer: 1
// Iteracja numer: 2
// Iteracja numer: 3
// Iteracja numer: 4

// Iterowanie po tablicy
let kolory = ["czerwony", "zielony", "niebieski"];
for (let i = 0; i < kolory.length; i++) {
    console.log("Kolor:", kolory[i]);
}
// Wynik:
// Kolor: czerwony
// Kolor: zielony
// Kolor: niebieski

Pętla `while`

Wykonuje blok kodu tak długo, jak długo podany warunek jest prawdziwy. Warunek jest sprawdzany przed każdą iteracją.

while (warunek) {
    // Kod do wykonania
    // Ważne: Należy pamiętać o modyfikacji zmiennej warunkowej, aby uniknąć pętli nieskończonej!
}

let i = 0;
while (i < 3) {
    console.log("Pętla while, iteracja:", i);
    i++; // Bez tego mielibyśmy pętlę nieskończoną!
}
// Wynik:
// Pętla while, iteracja: 0
// Pętla while, iteracja: 1
// Pętla while, iteracja: 2

Pętla `do...while`

Podobna do `while`, ale warunek jest sprawdzany po wykonaniu bloku kodu. Oznacza to, że blok kodu wykona się przynajmniej raz, nawet jeśli warunek jest od początku fałszywy.

do {
    // Kod do wykonania
    // Pamiętaj o modyfikacji zmiennej warunkowej!
} while (warunek);

let j = 5;
do {
    console.log("Pętla do...while, iteracja:", j);
    j++;
} while (j < 3); // Warunek jest fałszywy od początku
// Wynik:
// Pętla do...while, iteracja: 5 (wykonało się raz)

Pętla `for...of` (ES6)

Służy do iterowania po iterowalnych obiektach, takich jak tablice, stringi, mapy, sety itp. W każdej iteracji dostajemy kolejną wartość z kolekcji.

for (const element of kolekcja) {
    // Kod do wykonania dla każdego elementu
}

// Iterowanie po tablicy
let owoce = ["jabłko", "banan", "pomarańcza"];
for (const owoc of owoce) {
    console.log("Owoc:", owoc);
}
// Wynik:
// Owoc: jabłko
// Owoc: banan
// Owoc: pomarańcza

// Iterowanie po stringu
let tekst = "ABC";
for (const litera of tekst) {
    console.log("Litera:", litera);
}
// Wynik:
// Litera: A
// Litera: B
// Litera: C

Pętla `for...in`

Służy do iterowania po właściwościach obiektu (kluczach).

for (const klucz in obiekt) {
    // Kod do wykonania dla każdego klucza
    // Aby uzyskać wartość: obiekt[klucz]
}

let osoba = {
    imie: "Jan",
    nazwisko: "Kowalski",
    wiek: 30
};

for (const klucz in osoba) {
    console.log(`${klucz}: ${osoba[klucz]}`);
}
// Wynik (kolejność nie jest gwarantowana):
// imie: Jan
// nazwisko: Kowalski
// wiek: 30

Uwaga: Pętla `for...in` iteruje również po właściwościach dziedziczonych z prototypu. Zazwyczaj nie jest zalecana do iterowania po tablicach (lepiej użyć `for` lub `for...of`).

Instrukcje `break` i `continue`

• `break`: Natychmiast przerywa działanie pętli (lub instrukcji `switch`).
• `continue`: Przerywa bieżącą iterację pętli i przechodzi do następnej.

// Przykład break
for (let i = 0; i < 10; i++) {
    if (i === 5) {
        console.log("Przerywam pętlę przy i = 5");
        break; // Zakończ pętlę
    }
    console.log("Iteracja (break):", i);
}
// Wynik: 0, 1, 2, 3, 4, "Przerywam..."

// Przykład continue
for (let i = 0; i < 5; i++) {
    if (i === 2) {
        console.log("Pomijam iterację dla i = 2");
        continue; // Przejdź do następnej iteracji
    }
    console.log("Iteracja (continue):", i);
}
// Wynik: 0, 1, "Pomijam...", 3, 4

let suma = 0;

for (let i = 1; i <= 10; i++) {
    suma += i; // Dodaj bieżącą liczbę do sumy
}

console.log("Suma liczb od 1 do 10 wynosi:", suma); // Wynik: 55