JS for, while, do while

Cykly (Loops)

Cykly se používají pro opakování nějaké akce - např. když chceme vypsat čísla od 1 do 10

while

Cyklus while má následující syntax:

while (podmínka) { // kód }

Pokud je podmínka pravdivá (true), tak se cyklus while bude provádět

Příklad:

let i = 0; while (i < 3) { console.log(i); // vyloguje 0, 1, 2 i++; }

Náš cyklus v tomto případě bude obsahovat tři cykly

do while

V cyklu do while se náš kód provede minimálně jednou bez ohledu na podmínku

Syntax:

let a = 0; do { console.log(a); // vyloguje 0 i přes to že podmínka ve while neplatí a++; } while (a < -3);

for

Cyklus for je o trochu složitější, ale zároveň je i v kódech běžnější

Syntax:

for(začátek; podmínka; krok) { // kód }

Příklad:

for(let i = 0; i < 3; i++) { console.log(i); }

začátek - let i = 0; - na začátku cyklu se vytvoří proměnná i s hodnotou 0
podmínka - i < 3; - kontroluje se každý cyklus jestli i je menší jak 3 - pokud není, tak se cyklus zastaví
tělo - console.log(i); - každý cyklus se provede console.log proměnné i
krok - i++ - spustí se po každém cyklu - v našem případě se spustí po console.log(i);

break a continue

Pokud chceme náš cyklus zastavit, tak můžeme využít slovíčka break

Pokud chceme pokračovat v následujícím cyklu, tak můžeme využít slovíčka continue

for(let i = 0; i < 5; i++) { if (i == 0) continue; if (i == 3) break; console.log(i); }

Labely

Někdy je třeba potřeba se z několika vnořených cyklů dostat. K tomu slouží labely.

Každému cyklu můžeme dát označení a následně na toto označení můžeme odkazovat

Například:

prvniFor: for(let i = 0; i < 5; i++) { for(let a = 0; a < 10; a++) { if (a === 5) break prvniFor; console.log(a); } }

Editor

Pro živou ukázku je CSS a JavaScript vepsaný přímo v dokumentu - v praxi tyto soubory vždy oddělujte do externích souborů

<!DOCTYPE html> <html> <head> </head> <body> <script> prvniFor: for(let i = 0; i < 5; i++) { for(let a = 0; a < 10; a++) { if (a === 5) break prvniFor; console.log(a); } } </script> </body> </html>

Page

PS: Logy se zobrazují v konzoli - F12 - console

TWS/WAP Cheatsheet