Modi diversi di iterare su un array in JavaScript

Modi diversi di iterare su un array in JavaScript
In JavaScript, l'iterazione su un array è molto cruciale e può essere raggiunto utilizzando diversi metodi integrati e loop. Le strutture di looping JavaScript, nonché i metodi di array integrati, iterano su ogni singolo elemento di array. I loop tradizionali come per loop e while-loop sono il modo più semplice e semplice per iterare su un array mentre i metodi dell'array come il filtro (), la mappa (), ecc. sono usati per attraversare e per servire varie funzionalità sugli elementi dell'array.

Questo articolo coprirà i modi di seguito per iterare su un array in JavaScript:

  • Come iterare su un array usando il tradizionale per loop
  • Come iterare su un array usando il metodo JavaScript foreach ()
  • Come iterare su un array usando While Loop
  • Come usare per ... di dichiarazioni per iterare elementi di array
  • Come iterare gli elementi dell'array usando la funzione map ()

Quindi iniziamo!

Come iterare su un array usando il tradizionale per loop?

In qualsiasi linguaggio di programmazione incluso JavaScript, il modo più popolarmente usato per iterare su un array è per loop. Lo snippet di seguito ti aiuterà a capire la sintassi del per loop:

per (inizializzazione; condizione; incremento/decremento)
//codice

Qui,

  • "Inizializzazione" specifica dove iniziare il ciclo.
  • "Condizione" specifica i criteri di terminazione per il loop.
  • L'operatore di incremento e decremento aumenta o diminuisce il valore della variabile data.

Esempio: iterando su un array usando per loop
In questo programma, abbiamo una serie di nomi degli studenti e lo faremo iterare usando per loop:

stdnames = ["seth", "Mike", "Daniel", "John", "Bryn"];
per (i = 0; i < stdNames.length; i++)
console.log ("at indice", i, stdnames [i]);

In questo programma abbiamo eseguito le seguenti attività:

  • In primo luogo, abbiamo creato un array composto da cinque elementi.
  • Successivamente, abbiamo utilizzato il ciclo per iterare tutti gli elementi dell'array dato.
  • All'interno del circuito per loop, abbiamo utilizzato la proprietà di lunghezza per trovare la lunghezza dell'array.
  • Infine, abbiamo utilizzato la console.Metodo log () per stampare ogni elemento dell'array dato.

Questo è il modo in cui possiamo utilizzare il loop per iterare gli elementi dell'array in JavaScript.

Come iterare su un array usando il metodo JavaScript foreach ()

Il metodo Foreach () in JavaScript invoca una funzione di callback per ogni singolo elemento dell'array dato. Lo snippet di seguito ti aiuterà a iniziare con il metodo foreach ():

ArrayName.foreach ((item) =>
//codice
);

Esempio: iterating su un array usando il metodo foreach ()
Diamo un'occhiata al blocco di codice indicato di seguito per capire come utilizzare il metodo foreach () per iterare su un array in JavaScript:

var stdage = [15, 18, 20, 16, 17];
var string = "";
stdage.foreach (stampa);
funzione stampa (età)
string = string + age + "\ n";

console.log ("età dello studente:");
console.log (stringa);
  • In primo luogo, crea un array e una stringa vuota.
  • Successivamente, utilizza il metodo foreach () insieme all'array dato.
  • Il metodo Foreach () ha invocato la funzione "PrintAge ()" per ogni singolo elemento di array.
  • La funzione "Stampa" memorizzava l'età dello studente nella variabile stringa.
  • Infine, ha stampato l'età dello studente sulla console.

Ecco come funziona il metodo foreach () in javascript.

Come iterare su un array usando While Loop?

In JavaScript, un ciclo while può essere usato per iterare attraverso un array. Per fare ciò, dobbiamo seguire la sintassi seguente:

inizializzazione;
mentre (condizione)

//codice
incremento/decremento;

Esempio: iterando su un array usando While Loop

In questo programma, itereremo l'array utilizzando While Loop:

stdnames = ["seth", "Mike", "Daniel", "John", "Bryn"];
i = 0;
mentre io < stdNames.length)
console.log ("at indice", i, stdnames [i]);
io++

Il programma di cui sopra ha eseguito i seguenti compiti:

  • Creato un array.
  • Utilizzato il ciclo while.
  • Inizializzato il ciclo con 0.
  • Iterato su ogni singolo elemento dell'array.
  • Stampato l'indice corrente e il suo rispettivo valore.
  • Infine, ha incrementato la variabile.

L'output ha verificato il funzionamento del ciclo while in JavaScript.

Come usare per ... di dichiarazioni per iterare elementi di array?

Il per ... di Loop/Dichiarazione è una nuova aggiunta in JavaScript introdotto nelle ultime versioni di ES6. Ci consente di analizzare/iterare sugli oggetti iterabili come array, stringhe, set e così via. Considera lo snippet seguente per comprendere la sintassi di per ... di dichiarazioni:

per (variabile di iteble)
// codice

Esempio: iterando su un array usando per ... di dichiarazioni
Questo programma di esempio ti fornirà una profonda comprensione del per ... di dichiarazioni:

var stdage = [16, 18, 19, 16, 17];
var string = "";
per (var age of stdage)
string = string + age + "\ n";

console.log ("età dello studente:");
console.log (stringa);

Il programma di cui sopra serviva le funzionalità di seguito elencate:

  • Ha creato un array e una stringa vuota.
  • Utilizzato il per ... di dichiarazioni.
  • Iterato su ogni singolo elemento di array.
  • Archiviato l'età dello studente nella variabile di stringa.
  • Infine, ha stampato l'età dello studente sulla console.

L'output ha verificato il funzionamento del per ... di dichiarazioni in JavaScript.

Come iterare gli elementi dell'array usando la funzione map ()?

In JavaScript, la funzione Map () può essere utilizzata per ottenere una nuova serie di elementi mappati. Il metodo Map () invoca una funzione per ogni singolo elemento di array.

Il seguente sarà la sintassi per il metodo Map ():

ArrayName.mappa (fundaname);

Esempio: iterating su un array usando il metodo della mappa
In questo programma, utilizzeremo il metodo della mappa per iterare sull'array:

var stdage = [15, 20, 17, 16, 19];
var doubleage = stdage.Mappa (Twiceage)
funzione twiceage (risultato)
Risultato di ritorno * 2;

console.log ("Array originale:", stdage);
console.log ("Array risultante:", Doubleage);

Lo snippet di codice sopra ha eseguito le funzioni elencate di seguito:

  • Creato un array.
  • Utilizzare la funzione mappa () per iterare sull'array dato.
  • Il metodo Map () ha moltiplicato ogni elemento per 2 e lo ha restituito.

L'output ha chiarito che il metodo Map () ha iterato su ciascun elemento dell'array e ha moltiplicato gli elementi dell'array per 2.

Allo stesso modo, possiamo utilizzare alcuni altri noti metodi di array integrati per iterare su un array, ad esempio "array.filtro () "," array.Some () "," Array.ogni () ”e così via.

Conclusione

JavaScript offre diversi modi come loop e alcuni metodi di array integrati per iterare su un array. In JavaScript, le funzioni di iterazione dell'array come foreach (), map (), filtro (), ecc. operare su ciascun elemento di array. Questo articolo ha spiegato cinque modi comunemente usati per iterare elementi di array in JavaScript. Per una profonda comprensione dei concetti, ha spiegato ogni metodo di iterazione usando i migliori esempi adatti.