JavaScript za petlju (s primjerima)

U ovom ćete tutorijalu uz primjere naučiti o petljama i o petljama u JavaScriptu.

U programiranju se petlje koriste za ponavljanje bloka koda.

Na primjer, ako želite poruku prikazati 100 puta, tada možete koristiti petlju. To je samo jednostavan primjer; petljama možete postići puno više.

Ovaj se vodič fokusira na JavaScript forpetlju. O drugoj vrsti petlji naučit ćete u sljedećim vodičima.

JavaScript za petlju

Sintaksa forpetlje je:

  for(initialExpression; condition; updateExpression) ( // for loop body )

Ovdje,

  1. InitialExpression inicijalizira i / ili izjavljuje varijable i izvršava samo jednom.
  2. Procjenjuje se stanje .
    • Ako je uvjet false, forpetlja se prekida.
    • ako je uvjet true, forizvršava se blok koda unutar petlje.
  3. UpdateExpression ažurira vrijednost initialExpression kada je uvjet true.
  4. Ponovno se procjenjuje stanje. Taj se postupak nastavlja sve dok stanje nije false.

Da biste saznali više o uvjetima , posjetite JavaScript usporedbu i logičke operatore.

Dijagram toka JavaScript-a za petlju

Primjer 1: Prikažite tekst pet puta

 // program to display text 10 times const n = 5; // looping from i = 1 to 5 for (let i = 1; i <= n; i++) ( console.log(`I love JavaScript.`); )

Izlaz

Obožavam JavaScript. Obožavam JavaScript. Obožavam JavaScript. Obožavam JavaScript. Obožavam JavaScript.

Evo kako ovaj program radi.

Iteracija Promjenjiva Stanje: i <= n Akcijski
1. i = 1
n = 5		 true Obožavam JavaScript. je tiskan.
ja se povećava na 2 .
2. i = 2
n = 5		 true Obožavam JavaScript. je tiskan.
ja se povećava na 3 .
3. i = 3
n = 5		 true Obožavam JavaScript. je tiskan.
ja se povećava na 4 .
Četvrti i = 4
n = 5		 true Obožavam JavaScript. je tiskan.
ja se povećava na 5 .
5. i = 5
n = 5		 true Obožavam JavaScript. je tiskan.
ja se povećava na 6 .
6. i = 6
n = 5		 false Petlja je prekinuta.

Primjer 2: Prikaz brojeva od 1 do 5

 // program to display numbers from 1 to 5 const n = 5; // looping from i = 1 to 5 // in each iteration, i is increased by 1 for (let i = 1; i <= n; i++) ( console.log(i); // printing the value of i )

Izlaz

 1 2 3 4 5

Evo kako ovaj program radi.

Iteracija Promjenjiva Stanje: i <= n Akcijski
1. i = 1
n = 5		 true 1 je tiskan.
ja se povećava na 2 .
2. i = 2
n = 5		 true 2 je tiskan.
ja se povećava na 3 .
3. i = 3
n = 5		 true Ispisuje se 3.
ja se povećava na 4 .
Četvrti i = 4
n = 5		 true Ispisuje se 4.
ja se povećava na 5 .
5. i = 5
n = 5		 true Ispisuje se 5.
ja se povećava na 6 .
6. i = 6
n = 5		 false Petlja je prekinuta.

Primjer 3: Prikaži zbroj n prirodnih brojeva

 // program to display the sum of natural numbers let sum = 0; const n = 100 // looping from i = 1 to n // in each iteration, i is increased by 1 for (let i = 1; i <= n; i++) ( sum += i; // sum = sum + i ) console.log('sum:', sum);

Izlaz

 zbroj: 5050

Ovdje je vrijednost zbroja u početku 0 . Zatim forse ponavlja ciklus iz i = 1 to 100. U svakoj se iteraciji zbraja i, a vrijednost mu se povećava za 1 .

Kad postanem 101 , uvjet testa je falsei zbroj će biti jednak 0 + 1 + 2 + … + 100.

Gornji program za zbrajanje prirodnih brojeva također se može zapisati kao

 // program to display the sum of n natural numbers let sum = 0; const n = 100; // looping from i = n to 1 // in each iteration, i is decreased by 1 for(let i = n; i>= 1; i-- ) ( // adding i to sum in each iteration sum += i; // sum = sum + i ) console.log('sum:',sum);

Ovaj program također daje isti izlaz kao Primjer 3 . Isti zadatak možete ostvariti na mnogo različitih načina u programiranju; programiranje je sve o logici.

Iako su oba načina ispravna, pokušajte vaš kôd učiniti čitljivijim.

JavaScript Infinite for loop

Ako je test uvjet u forpetlji uvijek true, on traje zauvijek (sve dok se memorija ne napuni). Na primjer,

 // infinite for loop for(let i = 1; i> 0; i++) ( // block of code )

U gore navedenom programu uvijek je uvjet truekoji će zatim pokretati kôd beskonačno puno puta.

U sljedećem uputstvu naučit ćete whilei do… whilepetlju.

Zanimljivi članci...