Instrukcje warunkowe w JavaScript

1. Wprowadzenie

Instrukcje warunkowe w JavaScript pozwalają sterować przepływem programu — czyli decydować, które fragmenty kodu mają się wykonać w zależności od spełnienia określonego warunku logicznego. Dzięki nim aplikacja może reagować na różne sytuacje i zachowywać się dynamicznie.

Najczęściej warunki opierają się na wyrażeniach logicznych, które zwracają wartość true lub false.

---

2. Typowe instrukcje warunkowe w JavaScript

1. if
2. if...else
3. if...else if...else
4. switch
5. Operator warunkowy (ternary operator) ? :

---

3. Instrukcja if

Najprostsza forma instrukcji warunkowej. Wykonuje blok kodu tylko wtedy, gdy warunek zwraca true.

Składnia:

Przykład:

Zasada: Jeśli warunek w nawiasie () zwróci wartość „truthy” (np. true, liczba różna od 0, niepusty string), to blok kodu zostanie wykonany.

---

4. Instrukcja if...else

Służy do wykonania jednego z dwóch bloków kodu – w zależności od tego, czy warunek jest prawdziwy (true), czy fałszywy (false).

Składnia:

Przykład:

---

5. Instrukcja if...else if...else

Pozwala sprawdzić wiele warunków po kolei. Program sprawdza warunki od góry – zatrzymuje się przy pierwszym, który zwróci true.

Składnia:

Przykład:

Uwaga: Tylko pierwszy spełniony warunek jest wykonywany — pozostałe są pomijane.

---

6. Zagnieżdżone instrukcje if

Można umieszczać instrukcje warunkowe wewnątrz siebie, aby sprawdzać bardziej złożone przypadki.

Przykład:

Wskazówka: Zbyt głębokie zagnieżdżenia utrudniają czytelność kodu – lepiej użyć operatora logicznego && lub || albo struktury switch.

---

7. Operator warunkowy (ternary operator)

Krótsza forma zapisu if...else – idealna do prostych decyzji.

Składnia:

Przykład:

Zagnieżdżony ternary:

Wskazówka: Używaj operatora warunkowego tylko w prostych przypadkach — dla większej logiki lepszy będzie if...else.

---

8. Instrukcja switch

Instrukcja switch służy do wyboru jednej z wielu możliwych ścieżek na podstawie wartości wyrażenia.

Składnia:

Przykład:

Uwaga: Jeśli zapomnisz o break, kod przejdzie dalej do kolejnych przypadków (fall-through).

Przykład bez break:

---

9. Porównanie if i switch

Cecha	if...else	switch
Typ warunku	Dowolne wyrażenie logiczne	Porównanie jednej wartości
Liczba warunków	Niewielka liczba	Wiele konkretnych przypadków
Czytelność	Lepsza dla złożonych warunków	Lepsza dla wielu stałych wartości
Wykonanie	Sprawdza każdy warunek po kolei	Skacze do odpowiedniego case

Przykład porównawczy:

---

10. Warunki z wartościami logicznymi (truthy i falsy)

JavaScript automatycznie konwertuje wiele wartości na true lub false podczas sprawdzania warunku.

Falsy values (traktowane jako false):

• false
• 0
• "" (pusty string)
• null
• undefined
• NaN

Przykład:

Truthy values (traktowane jako true):

Wszystkie inne wartości, np.:

• "tekst"
• 1
• []
• {}
• funkcje

Przykład:

---

11. Łączenie warunków logicznych

Instrukcje if można łączyć za pomocą operatorów logicznych:

Operator	Działanie
&&	„i” – oba warunki muszą być prawdziwe
| |	„lub” – wystarczy, że jeden warunek jest prawdziwy
!	negacja – odwraca wynik logiczny

Przykład:

---

12. Dobre praktyki przy stosowaniu instrukcji warunkowych

• Używaj czytelnych warunków logicznych — unikaj zagnieżdżania wielu if w if.
• Komentuj złożone warunki, by zwiększyć czytelność.
• Zawsze używaj === zamiast ==, aby uniknąć błędów z konwersją typów.
• Jeśli masz wiele możliwych wartości jednej zmiennej — stosuj switch.
• Dla prostych warunków – używaj operatora ternarnego.
• W przypadku wielu złożonych warunków – rozważ funkcje pomocnicze.

---

13. Przykład praktyczny – Logowanie użytkownika

---

14. Podsumowanie

Instrukcja	Zastosowanie	Cechy
if	Wykonanie kodu, gdy warunek jest prawdziwy	Najprostsza forma
if...else	Wybór między dwiema ścieżkami	Często używana
if...else if...else	Wiele warunków	Sprawdza po kolei
switch	Wiele możliwych wartości jednej zmiennej	Czytelny przy dużej liczbie przypadków
? :	Skrócony if...else	Użyteczny w prostych wyrażeniach

---

15. Wnioski

• Instrukcje warunkowe to podstawa logiki programowania w JavaScript.
• Umożliwiają dynamiczne reagowanie na dane wejściowe i decyzje użytkownika.
• Znajomość ich działania i „truthy/falsy” to klucz do pisania poprawnego kodu.
• Dobrze dobrana struktura warunkowa poprawia czytelność, wydajność i niezawodność programu.

---

Podsumowanie praktyczne:

• Używaj if...else dla prostych warunków,
• switch dla wielu konkretnych wartości,
• ? : w prostych przypisaniach.

Dzięki temu Twój kod JavaScript będzie czysty, logiczny i łatwy w utrzymaniu.