logo

JavaScript slučky

Slučky JavaScriptu sú nevyhnutné na efektívne zvládnutie opakujúcich sa úloh. Opakovane vykonávajú blok kódu, pokiaľ zadaná podmienka zostáva pravdivá. Tieto slučky sú výkonnými nástrojmi na automatizáciu úloh a zefektívnenie vášho kódu.

Predpokladajme napríklad, že chceme tlačiť Ahoj svet 5-krát. To sa dá ľahko urobiť pomocou JS Loop. V Loop je potrebné zapísať príkaz iba raz a cyklus sa vykoná 5-krát, ako je uvedené nižšie:

JavaScript
for (let i = 0; i < 5; i++) {  console.log('Hello World!'); }>

Výkon
Hello World! Hello World! Hello World! Hello World! Hello World!>

Obsah



1. JavaScript pre slučku

The JS pre slučku poskytuje stručný spôsob písania štruktúry slučky. Cyklus for obsahuje inicializáciu, podmienku a prírastok/zníženie v jednom riadku, čím poskytuje kratšiu, ľahko laditeľnú štruktúru cyklovania.

Syntax

for (initialization; testing condition; increment/decrement) { statement(s) }>

Vývojový diagram

  • Podmienka inicializácie: Inicializuje premennú a označuje začiatok cyklu for. Dá sa použiť už deklarovaná premenná alebo môže byť deklarovaná premenná, len lokálne do slučky.
  • Skúšobná podmienka: Používa sa na testovanie podmienky ukončenia cyklu for. Musí vrátiť boolovskú hodnotu. Je to tiež Vstupná kontrolná slučka pretože podmienka sa kontroluje pred vykonaním príkazov cyklu.
  • Vykonanie výpisu: Keď je podmienka vyhodnotená ako pravdivá, vykonajú sa príkazy v tele cyklu.
  • Zvýšenie/zníženie: Používa sa na aktualizáciu premennej pre ďalšiu iteráciu.
  • Ukončenie slučky: Keď sa podmienka stane nepravdivou, cyklus sa ukončí, čím sa skončí jeho životný cyklus.

Príklad

Javascript
// JavaScript program to illustrate for loop let x; // for loop begins when x = 2 // and runs till x <= 4 for (x = 2; x <= 4; x++) {  console.log('Value of x: ' + x); }>

Výkon
Value of x: 2 Value of x: 3 Value of x: 4>

2. JavaScript počas slučky

The Slučka JS while je príkaz riadiaceho toku, ktorý umožňuje opakované vykonávanie kódu na základe danej booleovskej podmienky. Cyklus while si možno predstaviť ako opakovaný príkaz if.

Syntax

while (boolean condition) { loop statements... }>

Vývojový diagram

pričom slučka

  • Kým cyklus začína kontrolou podmienky. Ak je vyhodnotená ako pravdivá, potom sa vykonajú príkazy tela cyklu, inak sa vykoná prvý príkaz nasledujúci po slučke. Z tohto dôvodu sa nazýva aj Vstupná kontrolná slučka
  • Keď je podmienka vyhodnotená ako pravdivá, vykonajú sa príkazy v tele cyklu. Normálne príkazy obsahujú aktualizovanú hodnotu pre premennú, ktorá sa spracováva pre ďalšiu iteráciu.
  • Keď sa podmienka stane nepravdivou, cyklus sa ukončí, čo znamená koniec jeho životného cyklu.

Príklad

Javascript
// JavaScript code to use while loop let val = 1; while (val < 6) {  console.log(val);   val += 1; }>

Výkon
1 2 3 4 5>

3. JavaScript do-while Loop

The slučka JS do-while je podobný cyklu while s jediným rozdielom, že kontroluje podmienku po vykonaní príkazov, a preto je príkladom Ukončite riadiacu slučku. Vykoná obsah slučky aspoň raz, ak je podmienka nepravdivá.

Syntax

do { Statements... } while (condition);>

Vývojový diagram do-pri

  • Cyklus do-while začína vykonaním príkazu (príkazov). Prvýkrát sa nekontroluje žiadny stav.
  • Po vykonaní príkazov a aktualizácii hodnoty premennej sa skontroluje, či je podmienka pravdivá alebo nepravdivá. Ak sa vyhodnotí ako pravdivé, začne sa ďalšia iterácia cyklu.
  • Keď sa podmienka stane nepravdivou, cyklus sa ukončí, čo znamená koniec jeho životného cyklu.
  • Je dôležité poznamenať, že cyklus do-while vykoná svoje príkazy aspoň raz pred kontrolou akejkoľvek podmienky, a preto je príkladom riadiacej slučky ukončenia.

Príklad

Javascript
let test = 1; do {  console.log(test);  test++; } while(test <= 5)>

Výkon
1 2 3 4 5>

4. JavaScript for-in Loop

JS for-in slučka sa používa na iteráciu vlastností objektu. Cyklus for-in iteruje iba cez tie kľúče objektu, ktorých vlastnosť enumerable je nastavená na hodnotu true.

Syntax

for(let variable_name in object_name) { // Statement }>

Príklad: Tento príklad ukazuje použitie slučky for-in.

Javascript
let myObj = { x: 1, y: 2, z: 3 }; for (let key in myObj) {  console.log(key, myObj[key]); }>

Výkon
x 1 y 2 z 3>

5. JavaScript for-of Loop

JS for-of slučka sa používa napríklad na iteráciu iterovateľných objektov – pole, objekt, množina a mapa. Priamo iteruje hodnotu daného iterovateľného objektu a má stručnejšiu syntax ako cyklus for.

Syntax:

for(let variable_name of object_name) { // Statement }>

Príklad: Tento príklad ukazuje použitie cyklu for-of.

Javascript
let arr = [1, 2, 3, 4, 5]; for (let value of arr) {  console.log(value); }>

Výkon
1 2 3 4 5>

6. Vyhlásenie označené JavaScriptom

Kľúčové slovo štítku JS nezahŕňa kľúčové slovo goto. Používatelia môžu použiť kľúčové slovo continue s príkazom label. Okrem toho môžu používatelia použiť kľúčové slovo break na ukončenie cyklu/bloku. Kľúčové slovo break môžete použiť aj bez definovania označenia, ale ukončí iba nadradenú slučku/blok. Ak chcete ukončiť vonkajšiu slučku z vnútornej slučky pomocou kľúčového slova break, používatelia musia definovať označenie.

Syntax

Label: statement (loop or block of code)>

Príklad

Javascript
let sum = 0, a = 1;  // Label for outer loop  outerloop: while (true) {   a = 1;   // Label for inner loop   innerloop: while (a < 3) {   sum += a;   if (sum>12) { // Preruš vonkajšiu slučku od vnútornej slučky preruš vonkajšiu slučku;   } console.log('suma = ' + suma);   a++;   } }>

Výkon
sum = 1 sum = 3 sum = 4 sum = 6 sum = 7 sum = 9 sum = 10 sum = 12>

7. Vyhlásenie o prerušení JavaScriptu

vyhlásenie o prerušení JS sa používa na ukončenie vykonávania príkazu slučky alebo prepínača, keď je podmienka pravdivá.

Syntax

break;>

Príklad

Javascript
for (let i = 1; i < 6; i++) {  if (i == 4)   break;    console.log(i); }>

Výkon
1 2 3>

8. Vyhlásenie o pokračovaní v JavaScripte

JS pokračovať vo vyhlásení sa používa na prerušenie iterácie cyklu a na pokračovanie v ďalšej iterácii. Prerušenie iterácie je možné len vtedy, keď nastane špecifikovaná podmienka. Hlavný rozdiel medzi príkazom continue a break je v tom, že príkaz break úplne vypadne z cyklu, zatiaľ čo príkaz continue sa používa na prerušenie jedného príkazu a iteráciu na ďalší príkaz.

Syntax

continue;>

Príklad

Javascript
for (let i = 0; i < 11; i++) {  if (i % 2 == 0)   continue;    console.log(i); }>

Výkon
1 3 5 7 9>

9. Nekonečná slučka JavaScriptu (chyba slučky)

Jednou z najčastejších chýb pri implementácii akéhokoľvek druhu slučky je, že sa nemusí nikdy ukončiť, t. j. slučka beží nekonečne dlho. Stáva sa to vtedy, keď stav z nejakého dôvodu zlyhá.

Príklad: Tento príklad ukazuje nekonečnú slučku.

Javascript
// JavaScript program to illustrate infinite loop // Infinite loop because condition is not false // condition should have been i>0. for (nech i = 5; i != 0; i -= 2) { console.log(i); } nech x = 5; // Nekonečná slučka, pretože príkaz na aktualizáciu // nie je poskytnutý while (x == 5) { console.log('V slučke'); }>