I loop JavaScript sono essenziali per gestire in modo efficiente le attività ripetitive. Eseguono ripetutamente un blocco di codice finché una condizione specificata rimane vera. Questi loop sono strumenti potenti per automatizzare le attività e semplificare il codice.
Supponiamo ad esempio di voler stampare Ciao mondo 5 volte. Questo può essere fatto facilmente utilizzando JS Loop. In Loop, l'istruzione deve essere scritta solo una volta e il ciclo verrà eseguito 5 volte come mostrato di seguito:
JavaScript
for (let i = 0; i < 5; i++) { console.log('Hello World!'); }>
Produzione
Hello World! Hello World! Hello World! Hello World! Hello World!>
Tabella dei contenuti
- per Ciclo
- mentre Ciclo
- fai-mentre Loop
- Ciclo for-in
- for-of Loop
- Dichiarazione etichettata
- Dichiarazione di interruzione
- Continua dichiarazione
- Ciclo infinito (errore del ciclo)
1. JavaScript per Ciclo
IL JS per ciclo fornisce un modo conciso di scrivere la struttura del ciclo. Il ciclo for contiene l'inizializzazione, la condizione e l'incremento/decremento in un'unica riga, fornendo così una struttura di loop più breve e di facile debug.
Sintassi
for (initialization; testing condition; increment/decrement) { statement(s) }>
Diagramma di flusso
- Condizione di inizializzazione: Inizializza la variabile e segna l'inizio di un ciclo for. È possibile utilizzare una variabile già dichiarata oppure dichiarare una variabile, solo locale al loop.
- Condizione di test: Viene utilizzato per testare la condizione di uscita di un ciclo for. Deve restituire un valore booleano. È anche un Circuito di controllo dell'ingresso poiché la condizione viene verificata prima dell'esecuzione delle istruzioni del ciclo.
- Esecuzione dell'istruzione: Una volta che la condizione viene valutata come vera, vengono eseguite le istruzioni nel corpo del ciclo.
- Incremento/Decremento: Viene utilizzato per aggiornare la variabile per l'iterazione successiva.
- Terminazione del ciclo: Quando la condizione diventa falsa, il ciclo termina segnando la fine del suo ciclo di vita.
Esempio
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); }>
Produzione
Value of x: 2 Value of x: 3 Value of x: 4>
2. JavaScript durante il ciclo
IL JS ciclo while è un'istruzione del flusso di controllo che consente l'esecuzione ripetuta del codice in base a una determinata condizione booleana. Il ciclo while può essere pensato come un'istruzione if ripetuta.
Sintassi
while (boolean condition) { loop statements... }>
Diagramma di flusso
- Il ciclo While inizia con il controllo della condizione. Se viene valutato come vero, vengono eseguite le istruzioni del corpo del ciclo, altrimenti viene eseguita la prima istruzione successiva al ciclo. Per questo motivo è anche chiamato il Circuito di controllo dell'ingresso
- Una volta che la condizione viene valutata come vera, vengono eseguite le istruzioni nel corpo del ciclo. Normalmente le istruzioni contengono un valore aggiornato per la variabile elaborata per l'iterazione successiva.
- Quando la condizione diventa falsa, il ciclo termina, segnando la fine del suo ciclo di vita.
Esempio
Javascript // JavaScript code to use while loop let val = 1; while (val < 6) { console.log(val); val += 1; }>
Produzione
1 2 3 4 5>
3. Ciclo JavaScript do- while
IL Ciclo do-mentre di JS è simile al ciclo while con l'unica differenza che controlla la condizione dopo aver eseguito le istruzioni, e quindi è un esempio di Uscire dal ciclo di controllo. Esegue il contenuto del loop almeno una volta se la condizione è falsa.
Sintassi
do { Statements... } while (condition);>
Diagramma di flusso 
- Il ciclo do- while inizia con l'esecuzione delle istruzioni. Non viene effettuato alcun controllo di alcuna condizione per la prima volta.
- Dopo l'esecuzione delle istruzioni e l'aggiornamento del valore della variabile, la condizione viene verificata per un valore vero o falso. Se viene valutato come vero, inizia la successiva iterazione del ciclo.
- Quando la condizione diventa falsa, il ciclo termina, segnando la fine del suo ciclo di vita.
- È importante notare che il ciclo do- while eseguirà le sue istruzioni almeno una volta prima che venga verificata qualsiasi condizione e quindi è un esempio del ciclo di controllo di uscita.
Esempio
Javascript let test = 1; do { console.log(test); test++; } while(test <= 5)>
Produzione
1 2 3 4 5>
4. Ciclo for-in JavaScript
Ciclo for-in di JS viene utilizzato per scorrere le proprietà di un oggetto. Il ciclo for-in esegue l'iterazione solo su quelle chiavi di un oggetto la cui proprietà enumerabile è impostata su true.
Sintassi
for(let variable_name in object_name) { // Statement }>
Esempio: Questo esempio mostra l'uso del ciclo for-in.
Javascript let myObj = { x: 1, y: 2, z: 3 }; for (let key in myObj) { console.log(key, myObj[key]); }>
Produzione
x 1 y 2 z 3>
5. JavaScript for-of Loop
Ciclo for-of di JS viene utilizzato per ripetere gli oggetti iterabili, ad esempio: array, oggetto, set e mappa. Itera direttamente il valore dell'oggetto iterabile dato e ha una sintassi più concisa rispetto al ciclo for.
Sintassi:
for(let variable_name of object_name) { // Statement }>
Esempio: Questo esempio mostra l'uso del ciclo for-of.
Javascript let arr = [1, 2, 3, 4, 5]; for (let value of arr) { console.log(value); }>
Produzione
1 2 3 4 5>
6. Dichiarazione etichettata JavaScript
Parola chiave dell'etichetta JS non include una parola chiave goto. Gli utenti possono utilizzare la parola chiave continue con l'istruzione label. Inoltre, gli utenti possono utilizzare la parola chiave break per terminare il loop/blocco. È inoltre possibile utilizzare la parola chiave break senza definire l'etichetta ma termina solo il ciclo/blocco principale. Per terminare il ciclo esterno dal ciclo interno utilizzando la parola chiave break, gli utenti devono definire l'etichetta.
Sintassi
Label: statement (loop or block of code)>
Esempio
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) { // Interrompe il ciclo esterno dal ciclo interno interrompe il ciclo esterno; } console.log('sum = ' + sum); a++; } }>
Produzione
sum = 1 sum = 3 sum = 4 sum = 6 sum = 7 sum = 9 sum = 10 sum = 12>
7. Dichiarazione di interruzione JavaScript
Dichiarazione di interruzione JS viene utilizzato per terminare l'esecuzione del ciclo o dell'istruzione switch quando la condizione è vera.
Sintassi
break;>
Esempio
Javascript for (let i = 1; i < 6; i++) { if (i == 4) break; console.log(i); }>
Produzione
1 2 3>
8. Dichiarazione di continuazione JavaScript
JS continua la dichiarazione viene utilizzato per interrompere l'iterazione del ciclo e proseguire con l'iterazione successiva. L'interruzione dell'iterazione è possibile solo quando si verifica la condizione specificata. La differenza principale tra l'istruzione continue e break è che l'istruzione break interrompe completamente il ciclo mentre continue viene utilizzato per interrompere un'istruzione e passare all'istruzione successiva.
Sintassi
continue;>
Esempio
Javascript for (let i = 0; i < 11; i++) { if (i % 2 == 0) continue; console.log(i); }>
Produzione
1 3 5 7 9>
9. Ciclo infinito JavaScript (errore del ciclo)
Uno degli errori più comuni durante l'implementazione di qualsiasi tipo di ciclo è che potrebbe non terminare mai, ovvero il ciclo viene eseguito per infinite volte. Ciò accade quando la condizione fallisce per qualche motivo.
Esempio: Questo esempio mostra un ciclo infinito.
Javascript // JavaScript program to illustrate infinite loop // Infinite loop because condition is not false // condition should have been i>0. for (let i = 5; i != 0; i -= 2) { console.log(i); } sia x = 5; // Ciclo infinito perché l'istruzione update // non è fornita while (x == 5) { console.log('In the loop'); }>