JavaScript per Loop
Esempio
Ripeti (ripeti) un blocco di codice cinque volte:
for (let i = 0; i < 5; i++) {
text += i + "<br>";
}
Esegui il ciclo (ripeti su) un array per raccogliere i nomi delle auto:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
for (let i = 0; i < cars.length; i++) {
text += cars[i] + "<br>";
}
- Il ciclo inizia in posizione 0 (
let i = 0
). - Il ciclo aumenta automaticamente
i
per ogni corsa. - Il ciclo dura fino a
i < cars.length
.
Altri esempi di seguito.
Definizione e utilizzo
L' for
istruzione definisce un blocco di codice che viene eseguito finché una condizione è
true
.
Nota
Se ometti l'istruzione 2, devi fornire un'interruzione all'interno del ciclo.
Altrimenti il ciclo non finirà mai. Questo andrà in crash il tuo browser.Guarda anche:
Sintassi
for (statement 1; statement 2; statement 3) {
code block to be executed
}
Parametri
Parameter | Description |
statement 1 | Optional. Executed before the code block starts. Normally used to initialize a counter variable. To initiate multiple values, separate each value with a comma. This parameter can be omitted, but not the semicolon ";" |
statement 2 | Optional. The condition for running the code block. If it returns true the loop will start over again, otherwise the loop will end.This parameter can be omitted, but not the semicolon ";" |
statement 3 | Optional. Executed after the code block. Normally used to increment the counter variable. This parameter can be omitted (e.g. to increase/decrease values inside the loop) |
Dichiarazioni di ciclo JavaScript
Dichiarazione | Descrizione | |
rottura | Esce da un ciclo | |
Continua | Salta un valore in un ciclo | |
mentre | Esegue il ciclo di un blocco di codice mentre una condizione è vera | |
fare durante | Esegue un ciclo di un blocco di codice una volta, quindi finché una condizione è vera | |
per | Esegue il ciclo di un blocco di codice mentre una condizione è vera | |
per... di | Esegue il ciclo dei valori di qualsiasi iterabile | |
per... dentro | Cicla le proprietà di un oggetto |
Altri esempi
Avvia più valori nel primo parametro:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
for (let i = 0, len = cars.length, text = ""; i < len; i++) {
text += cars[i] + "<br>";
}
Omettere i primi parametri (impostare i valori prima dell'avvio del loop):
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 2;
let len = cars.length;
let text = "";
for (; i < len; i++) {
text += cars[i] + "<br>";
}
Usa continue
: scorre un blocco di codice, ma salta il valore 3:
let text = "";
for (let i = 0; i < 5; i++) {
if (i == 3) continue;
text += i + "<br>";
}
Usa break
- Ciclo di un blocco di codice, ma esci dal ciclo quando i == 3
:
let text = "";
for (let i = 0; i < 5; i++) {
if (i == 3) break;
text += i + "<br>";
}
Ometti il secondo parametro.
Usalo break
per uscire dal ciclo, altrimenti il ciclo non finirà mai e il tuo browser andrà in crash:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let text = "";
for (let i = 0; ; i++) {
if (i == cars-length) break;
text += cars[i] + "<br>";
}
Ciclo su un array in ordine decrescente (incremento negativo):
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let text = "";
for (let i = cars.length - 1; i >= 0; i--) {
text += cars[i] + "<br>";
}
Ometti l'ultimo parametro e incrementa i valori all'interno del ciclo:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let len = cars.length;
for (; i < len;) {
text += cars[i] + "<br>";
i++;
}
Cicla una NodeList e cambia il colore di tutti gli elementi p nell'elenco:
const myNodelist = document.getElementsByTagName("P");
for (let i = 0; i < myNodelist.length; i++) {
myNodelist[i].style.color = "blue";
}
Un ciclo nidificato (un ciclo all'interno di un ciclo):
let text = "";
for (let = 0; i < 3; i++) {
text += i + "<br>";
for (let j = 10; j < 15; j++) {
text += j + "<br>";
}
}
Supporto browser
for
è una funzione ECMAScript1 (ES1).
ES1 (JavaScript 1997) è completamente supportato in tutti i browser:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |