Pętle w JavaScript, instrukcje warunkowe, sterowanie przebiegiem programu. Podstawy języka część 4.

Program control

Poziom podstawowy

W tym artykule omówimy nieco szerzej instrukcje warunkowe, a także pętle i instrukcję switch. To wszystko aby mieć pełne pojęcie o sterowaniu przebiegiem programu.

Zbliżamy się do końca omawiania podstaw języka. To świetnie, gdyż na kolejnych etapach zaawansowania zabawa będzie coraz lepsza (jak i możliwości).

Instrukcja warunkowa if

Czyli wykonywanie kodu zależnie od warunku.

Składnia:

if (warunek) {
    operacja;
}

gdzie ‚warunek’ jest wyrażeniem badanym pod kątem prawdziwości (true).

if (!warunek) {
    operacja; // tutaj operacja wykona się jeśli 
              // 'warunek' nie jest prawdą (false)
}

Przykład – instrukcje if, else:

var x = 1, y = 2;

if (x == y) {
    alert('Wartości są równe');
} else {
    alert('Wartości nie są równe');
}

Przykład – if, else if, else:

window.wiek = prompt("Ile masz lat?", "");
txt = "";
if (wiek <= 17) {
    txt = "Nie kupisz piwa!";
}
else if ( (wiek > 17) && (wiek <= 100) ) {
    txt = "Zdrówko!";
}
else {
    txt = "To zły wiek na piwko";
}

alert(txt);

W powyższym kodzie zostanie utworzona zmienna „wiek”, do której przypisana zostanie wartość podana przez użytkownika (pobrana z monitu – funkcja prompt). Następnie zostanie utworzona wiadomość końcowa dla użytkownika, zależnie od warunków, jakie spełnia podana przez użytkownika wartość.

Operator warunkowy ?:

Ten operator nie został omówiony wraz z innymi w poprzedniej części. Operator warunkowy ?: pozwala na określenie wartości jaka ma być zwrócona w zależności od wyrażenia warunkowego. Pozwala zapisywać instrukcje warunkowe zwięźlej niż przy użyciu instrukcji if.

Składnia: warunek ? wartosc_dla_prawdy: wartosc_dla_falszu;

Przykład – użycie operatora warunkowego:

var a = 4;
var b = 3;
wynik = (a == b) ? 'Zmienna są równe' : 'Zmienne nie są równe';
alert(wynik);

Warunek musi zwracać wartość true lub false.

Instrukcja switch

Jest kolejnym sposobem zapisu warunków. Wykonywanie kodu zależnie od przypadku (wartości), którą przyjmuje wyrażenie. Jest to również sposób na zwięzły zapis kodu.

Składnia:

switch (wyrazenie) {
    case wartosc:
        instrukcja1;
    break;
    case wartosc2:
        instrukcja2;
    break;
    default: instrukcja3;
}

Przykład – użycie instrukcji switch:

var x = 1, y = 2;
switch (x + y) {
    case 1:
        alert('1');
    break;

    case 3:
        alert('3');
    break;

    case 5:
        alert('5');
    break;

    default: alert('niedopasowane');
}

W instrukcji switch badane są przypadki, jeśli wartość wyrażenia zgadza się z którymś przypadkiem, wykonywane są instrukcje po dwukropku. Może być ich wiele.

Polecenie break służy do przerywania bieżącej operacji, stosowane głównie w switch’u i pętlach (o tych za chwilę).

Etykieta default określa akcję domyślną; w powyższym przykładzie komunikat ‚niedopasowane’ pojawił by się jeśli suma x + y nie została by dopasowana do żadnego przypadku.


Pętle w JavaScript

Pętle – mówiąc najprościej: służą do wielokrotnego wykonania kodu, zależnie od zadanego warunku.

Pętla for:

for (i = 1; i <= 5; i++) {
    alert(i);
}

Pętla while – kod wykonuje się dopóki warunek jest spełniony:

var i = 0;
while (i < 5) {
    i++; // jeśli nie zwiększymy, zmienna i zawsze będzie 
         // mniejsza od 5 - powstanie pętla nieskończona
    alert(i);
}

Pętla do – wykonuje kod, a potem sprawdza warunek, więc od while różni ją to, że kod wykona się na pewno przynajmniej jeden raz:

var i = 0;
do {
    alert(i);
    i++;
}
while (i < 5);

Operator in i konstrukcja for i in

Słowo in zwraca true, jeśli specyficzne właściwości znajdują się w danym obiekcie:
propertyNameOrNumber in objectName

Częstym zastosowaniem jest stworzenie iteratora w postaci for i in. Konstrukcja for(i in obiekt) będzie zmiennej i kolejno przypisywać nazwy pól z obiektu / tablicy.

Przykład – użycie konstrukcji for i in:

for (i in ob)
    alert("Pole " + i + " ma wartość: " + ob[i]);

Nawiasy dokoła wyrażenia są opcjonalne, ale używanie ich jest w dobrym stylu.

Pętle nieskończone

Poniżej dwa przykłady pętli nieskończonych: z użyciem pętli for oraz inna, bazująca na pętli while.

for (;;) {
    ;
}

while (true) {
    ;
}

W tych przypadkach pętle będą robić „nic” w nieskończoność 🙂 Nie zostały określone żadne warunki zakończenia pętli, a ciało pętli nie zawiera instrukcji break, która mogła by przerwać jej działanie.

W rzeczywistych implementacjach można spotkać pętle nieskończone. Uruchamiają one przetwarzanie, zwykle większych porcji danych, jednak ciało tych pętli zwykle zawiera instrukcje przerywającą (break), w momencie gdy zajdzie już określony warunek.

W następnym artykule omówimy funkcje i tablice, a także funkcje przydatne w pracy z nimi.

Programista WWW i aplikacji mobilnych z wieloletnim doświadczeniem, początkujący bloger. Pasjonat programowania, nowych technologii, e-commerce, a także sportu i motoryzacji.

Twitter LinkedIn Google+ Skype Xing 

Podaj dalej: Share on Facebook1Tweet about this on TwitterShare on Google+1Share on LinkedIn0Share on Tumblr0Digg thisEmail this to someonePin on Pinterest1
Możesz skomentować leave a response, lub podać trackback z własnej strony.
  • Adam P.

    „W tych przypadkach pętle będą robić „nic” w nieskończoność :-)”

    Więc w kwestii praktycznej: te pętle mogą zatrudnić się w urzędzie np. w Zakładzie Utylizacji Szmalu 😛

    Żart oczywiście 😉

    Pzdr

  • 😉