Modest Programmer logo
2 września 2018
Tagi: JavaScript
W dzisiejszym artykule chciałem Ci przybliżyć temat instrukcji warunkowej if w JavaScripcie. W artykułach o operatorach wspominałem Ci, że operatory często są używane właśnie w instrukcjach warunkowych, także ta wiedza na pewno będzie przydatna w lepszym poznaniu dzisiejszego tematu. W JavaScript są 2 instrukcje warunkowe, instrukcja warunkowa if, którą przedstawię właśnie w tym artykule, oraz instrukcja warunkowa switch, o której będę pisał w kolejnym artykule. Instrukcje warunkowe w programowaniu są używane bardzo często, więc musisz dobrze zrozumieć ten temat, ale dodam że nie jest on skomplikowany :)

Instrukcje warunkowe wykonują jakąś instrukcję na podstawie zwracanej wartości warunku, czyli true (prawda) lub false (fałsz). Jeżeli wyrażenie w warunku zwraca true wtedy wykonuje się podana instrukcja kodu. Podstawowa struktura instrukcji if:
if (warunek) {
    instrukcjaDoWykonania
}
Instrukcję, można jeszcze rozwinąć o blok else if:
if (warunek) {
    instrukcjaDoWykonania
}
else if (innyWarunek) {
    innaInstrukcjaDoWykonania
}
Jeżeli "warunek" jest spełniony, wykona się podana poniżej instrukcja, jeżeli warunek nie zostanie spełniony, lecz "innyWarunek" zostanie spełniony, wtedy wykona się "innaInstrukcjaDoWykonania". Warunków else if, oczywiście może być więcej niż 1, może ich być nieskończenie wiele. Można jeszcze dodać to tego zapisu else:
if (warunek) {
    instrukcjaDoWykonania
}
else if (innyWarunek) {
    innaInstrukcjaDoWykonania
}
else {
    kolejnaInstrukcja
}
Który mówi o tym, że jeżeli "warunek" oraz "innyWarunek" nie zostaną spełnione to zawsze wykona się instrukcja zawarta w bloku else". Oczywiście instrukcja warunkowa może równie dobrze zawierać tylko if oraz else.

Najlepiej będzie przedstawić to na konkretnym zadaniu. Załóżmy, że mamy napisać program który na podstawie podanego miesiąca (tylko miesiąca, tak żeby nie wdawać się w szczegóły), wypisuje porę roku.
let month = 1;
if (month > 0 && month <= 3){
    console.log("Zima");
} else if (month > 3 && month <= 6) {
    console.log("Wiosna");
} else if (month > 6 && month <= 8) {
    console.log("Lato");
} else if (month > 8 && month <= 12) {
    console.log("Jesień");
} else {
    console.log("Zły miesiąc.");
}
W powyższym przykładzie jeżeli zmienna month będzie równa 1, w konsoli zostanie zapisana "Zima". Dla 6 będzie to "Wiosna", dla 7 "Lato" itd.

Jeżeli w bloku instrukcji jest tylko 1 instrukcja do wykonania, można wtedy pominąć nawiasy klamrowe. Wtedy powyższy kod może mieć również taką postać:
let month = 1;
if (month > 0 && month <= 3)
    console.log("Zima");
else if (month > 3 && month <= 6)
    console.log("Wiosna");
else if (month > 6 && month <= 8)
    console.log("Lato");
else if (month > 8 && month <= 12)
    console.log("Jesień");
else
    console.log("Zły miesiąc.");
Na koniec wspomnę jeszcze o operatorze warunkowym, celowo nie wspominałem Ci o tym operatorze w poprzednich artykułach, ponieważ nie znałeś jeszcze instrukcji warunkowych. Jest to skrócona, często używana wersja instrukcji warunkowej if. Ogólna struktura skróconej instrukcji warunkowej wygląda w taki sposób:
let x = (warunek) ? instrukcjaGdyTrue : instrukcjaGdyFalse;
Przykładowy kod if w wersji podstawowej:
let number = 4;
let isEven;
if (number % 2 == 0)
    isEven = true;
else
    isEven = false;
Ten sam blok kodu w wersji skróconej może wyglądać w taki sposób:
let number = 4;
isEven = (number % 2 == 0) ? isEven = true : isEven = false;
Jeśli chodzi o instrukcję warunkową if, to myślę że dzisiaj to wszystko. Kolejną instrukcję warunkową - switch, przedstawię w jutrzejszym artykule.

To wszystko co chciałem Ci przekazać w tym artykule. Zapraszam Cię do kolejnych artykułów z serii podstaw programowania w języku JavaScript.

Poprzedni artykuł - Operatory porównania, logiczne oraz bitowe w JavaScript.
Następny artykuł - Instrukcja warunkowa switch w JavaScript.
Autor artykułu:
Kazimierz Szpin
Kazimierz Szpin
Programista. Specjalizuje się w C#, głównie WPF, Windows Forms oraz ASP.NET MVC.
Autor bloga ModestProgrammer.pl
Dodaj komentarz
© Copyright 2018 modestprogrammer.pl. Wszelkie prawa zastrzeżone Design by Kazimierz Szpin