Javascript Per Ciclo

| | | | | | | | | | | | | | | | | | | | | | | | | |

Un ciclo JavaScript for esegue un blocco di codice finché una condizione specificata è vera. I cicli for JavaScript accettano tre argomenti: inizializzazione, condizione e incremento. L’espressione della condizione viene valutata su ogni ciclo. Un ciclo continua a essere eseguito se l’espressione restituisce true.

I cicli ripetono lo stesso blocco di codice finché non viene soddisfatta una determinata condizione. Sono utili per molte attività di programmazione ripetitive.

Ad esempio, potresti avere due elenchi di nomi, nomi e cognomi, che desideri unire in un elenco di nomi completi. Potresti scrivere una riga di codice per ogni nome, ma ciò potrebbe richiedere centinaia di righe di codice se l’elenco è lungo. Inoltre, cosa succede se non sei sicuro di quanto sarà lungo l’elenco? Qui puoi usare un ciclo che ripete un blocco di codice simile unendo ogni elemento della lista.

Ci sono due tipi principali di cicli usati in JavaScript: cicli while e cicli for. I cicli While sono basati su una condizione e vengono eseguiti finché tale condizione è uguale a true. I cicli for vengono eseguiti mentre un determinato insieme di condizioni è vero. Possono contare il numero di iterazioni effettuate dal ciclo.

In questa guida, esploreremo le basi dei cicli JavaScript for. Discuteremo anche del per… in e for…of loop JavaScript e usa alcuni esempi per illustrare come funzionano questi loop in JavaScript.

JavaScript for Loops

Un ciclo for esegue ripetutamente lo stesso codice finché una condizione è soddisfatta. Ogni iterazione di un ciclo esegue lo stesso codice con un valore diverso. La sintassi per un ciclo for è la seguente:

Questa sintassi è piuttosto complessa, quindi scomponiamola e definiamo ogni termine che abbiamo usato.

Inizializzazione viene utilizzata per dichiarare una variabile contatore. Questa variabile tiene traccia di quante volte il nostro ciclo è stato eseguito.

Condizione è la condizione che viene valutata prima dell’inizio di ogni ciclo. Se la condizione è uguale a true, verrà eseguito il codice all’interno del ciclo for. Se la condizione diventa false, il ciclo smetterà di funzionare.

Incrementa aggiorna il contatore del ciclo ogni volta che il ciclo viene eseguito.

Utilizziamo un esempio di base per mostrare come un for funziona in JavaScript. Ecco un ciclo che stampa i numeri tra 0 e 5:

Il nostro codice restituisce quanto segue:

Puoi vedere che il nostro codice è stato eseguito ripetutamente fino al nostro ciclo condizione è stata soddisfatta. Quando il numero 4 viene stampato sulla console JavaScript, il nostro ciclo si interrompe. Questo perché abbiamo indicato al nostro ciclo di stampare i numeri nell’intervallo di 0 e 5.

Componenti di un ciclo For in JavaScript

Let&rsquo ;s scompongono il nostro esempio in termini di componenti di un ciclo for:

Inizializzazione

L’inizializzazione del nostro ciclo dichiara una variabile che tiene traccia di quante volte il nostro ciclo è stato eseguito. Nell’esempio sopra, abbiamo usato let i = 0;. Questo dice al nostro programma di avviare un contatore chiamato i che ha il valore iniziale 0.

In genere, le variabili di inizializzazione hanno il nome i., ma puoi usare qualsiasi nome di variabile desideri.

Condizione

Il nostro ciclo usa i < 5 condizione. Questo dice al nostro programma che il nostro ciclo dovrebbe essere eseguito solo quando la variabile i è minore di 5.

Se i è uguale o maggiore di 5, il nostro ciclo si fermerà.

Incremento

Alla fine del nostro ciclo for, il nostro il codice usa i++ come incremento. Questa funzione dice al nostro programma di aggiungere 1 alla variabile i ogni volta che viene eseguito il ciclo.

For Loop JavaScript: come funziona

Ora che abbiamo suddiviso il nostro ciclo, possiamo discutere di come funziona il ciclo nel suo insieme. Ecco il codice del ciclo che abbiamo usato sopra:

Per iniziare, dichiariamo un ciclo for. Questo ciclo ha una variabile di inizializzazione impostata su 0. Quindi, il nostro contatore inizia da 0.

Quindi, affermiamo che il nostro ciclo dovrebbe essere eseguito quando i è inferiore a 5.

Il nostro codice incrementa il contatore i di uno ogni volta che viene eseguito il nostro ciclo. Se la nostra condizione è soddisfatta, viene eseguito il codice all’interno del nostro ciclo, che ci dà il risultato che abbiamo visto sopra. Quindi, il nostro codice scorre un blocco di codice finché i è uguale o maggiore di cinque, quindi il nostro codice si interrompe.

Se creassimo una situazione in cui la nostra condizione restituisce sempre true, il ciclo diventerebbe infinito. I cicli infiniti continuano indefinitamente a meno che non aggiungiamo un’istruzione break.

Il nostro codice quindi stampa i quando viene eseguita l’istruzione for.

Vale la pena notare che ogni argomento in un ciclo for è facoltativo. Ad esempio, se abbiamo già dichiarato una variabile di inizializzazione, non è necessario per dichiararne uno nuovo nel nostro ciclo for. Di seguito è riportato un esempio di un ciclo for utilizzato con due argomenti: una condizione e un incremento.

Il nostro codice restituisce:

Dobbiamo includere il punto e virgola anche se non abbiamo specifiche ified una variabile di inizializzazione per il nostro ciclo. Questo perché il punto e virgola viene utilizzato per indicare al programma dove vengono visualizzati l’inizializzazione, la condizione e l’incremento. Senza un punto e virgola, JavaScript non può interpretare il nostro ciclo.

JavaScript Per… Nei cicli

for‚Ķin i cicli possono essere usati per scorrere gli elementi all’interno di un oggetto iterabile. Ecco la sintassi per un ciclo for‚Ķin in JavaScript:

for‚Ķin i cicli sono utili se vogliamo eseguire un certo blocco di codice in base al numero di attributi in un oggetto. Ad esempio, potremmo avere un oggetto studente le cui proprietà vogliamo stampare sulla console.

Ecco un esempio di un ciclo for‚Ķin che scorrerà ogni elemento in un oggetto studente e stampa ogni attributo:

Il nostro programma restituisce quanto segue:

Come puoi vedere, il nostro programma ha ripetuto ogni elemento nell’oggetto studente e ne ha stampato il nome della proprietà. Se volessimo stampare il valore di ogni elemento, potremmo usare questo codice:

Il nostro codice restituisce quanto segue:

Abbiamo usato il codice student[item] per ottenere il valore di ogni elemento nel nostro oggetto iterabile. Quindi, abbiamo stampato l’elemento sulla console utilizzando console.log().

JavaScript For…Of Loops

For‚Ķin i cicli sono utili quando si desidera scorrere le proprietà in un oggetto. Dovresti usare un ciclo for‚Ķof if Ma se vuoi scorrere gli elementi in un oggetto.

Facciamo scorrere una serie di studenti e scriviamo i loro nomi sulla console:

Il nostro codice restituisce quanto segue:

Come puoi vedere, il nostro ciclo for‚Ķof ha ripetuto ogni elemento nell’array studenti. Ogni elemento viene stampato sulla console.

I cicli for‚Ķof sono più concisi di un normale ciclo for. Questo rende un ciclo for‚Ķof più facile da leggere. La regola generale della programmazione è usare gli strumenti giusti per il lavoro. I cicli for‚Ķof sono più facili per capire se vuoi scorrere un elenco. Quindi, dovresti ld usa i cicli for‚Ķof quando possibile.

Analogamente, possiamo usare for…of su una stringa per scorrere i caratteri che la compongono. Ecco un esempio di questo in azione:

Il risultato del nostro codice è:

Il nostro programma ha ripetuto ogni lettera nella variabile name, quindi le ha stampate singolarmente alla console.

Questo potrebbe essere utile se vuoi controllare se un carattere appare in una stringa, ad esempio.



Conclusione

I cicli for sono una funzione utile in JavaScript che ti consente di eseguire un blocco di codice mentre un certa condizione restituisce true.

In questo articolo, abbiamo analizzato come funzionano i cicli for e come puoi usarli in JavaScript. Abbiamo anche discusso su come usare i cicli for‚Ķin e for‚Ķof in JavaScript. Ora sei pronto per iniziare ad automatizzare le attività ripetitive utilizzando i cicli for come un master JavaScript !