CONTATTACI

Blog

Developer che ha tra le mani il logo di javascript con robottino sulla spalla

Come iterare sugli array in JavaScript: il metodo forEach

Il linguaggio JavaScript è fondamentale per tutti coloro che aspirano a diventare web developer. Insieme a linguaggio CSS e linguaggio HTML fa parte di quei linguaggi necessari per sviluppare siti web, specialmente lato front-end.

Per migliorare la tua conoscenza di questo linguaggio, vedremo diversi esercizi JavaScript volti ad approfondire alcuni costrutti logici built-in fondamentali per padroneggiarlo al meglio.

Nella programmazione informatica la pratica è fondamentale per assimilare tutte le regole sintattiche e semantiche che distinguono i vari linguaggi di programmazione che si vogliono imparare. Tutti i linguaggi si distinguono per sintassi, metodi built-in, costrutti dedicati, ma condividono la logica di base che accomuna il mondo della programmazione nel strutturare determinati script.

Una struttura dati comune a tutti i linguaggi che vedremo oggi è l’array JavaScript. L’array (vettore in italiano) è una struttura statica formata da un insieme di variabili. Spesso questi array vengono popolati tramite cicli foreach JavaScript, vale a dire costrutti iterativi molto importanti non solo in JS, ma nella programmazione in generale.

In questo articolo vedremo come gestire JavaScript array foreach tramite degli esempi / esercizi JavaScript. Partiamo dalla sintassi Javascript per il metodo foreach, che è la seguente:

 nomeArray.forEach(function(currentValue, index, array)).

nomeArray corrisponde alla variabile array che abbiamo nominato e dichiarato. currentValue rappresenta il valore corrente dell’elemento dell’array. Index è opzionale, rappresenta l’indice dell’elemento corrente del vettore. Array è invece opzionale, rappresenta l’array a cui appartiene l’elemento preso in considerazione. Vediamo alcuni esempi in cui è possibile sfruttare questo metodo JavaScript.

 

let numbers = [44, 25, 16, 0, 12, 9];

numbers.forEach(function(number, index){
  console.log('indice: ' + index + ' numero: ' + numero);
});

Tramite il console.log stampiamo lungo tutta la durata del ciclo l’indice e il numero, ovvero ciò che è contenuto nell’array.

Vediamo adesso un esempio un po’ più complesso del JavaScript for each. Dichiarando in input un array di numeri, controlliamo la posizione pari o dispari utilizzando l’operatore modulo.

let sum_even = 0, sum_odd = 0;
let numbers = [44, 25, 16, 0, 17, 9];


numbers.forEach(sumEvenOdd);


function sumEvenOdd(element, index) {
  if (index % 2 == 0){
     sum_even += element;
  }
  else {
     sum_odd += element;
  }
  document.getElementById("somma-pari").innerHTML = sum_even;
  document.getElementById("somma-dispari").innerHTML = sum_odd;
}

Questo semplice script alla fine ci stamperà i valori, sommati, individuati come pari e come dispari mentre viene condotta l’iterazione sull’array. Il JS foreach è molto più compatto del ciclo for che comunemente viene utilizzato per iterare su un array o su un costrutto statico formato da più variabili.

 

let sum_even = 0, sum_odd = 0;
let numbers = [44, 25, 16, 0, 17, 9];


for(let i = 0; i < numbers.length; i++){
  if (index % 2 == 0){
    sum_even += numbers[i];
  }
 else {
    sum_odd += numbers[i];
 }
 document.getElementById("somma-pari").innerHTML = sum_even;
 document.getElementById("somma-dispari").innerHTML = sum_odd;

Il JS array foreach nella sua forma risulta molto più facile da scrivere, anche nel corpo della funzione stessa. Non dobbiamo inserire manualmente l’incremento e abbiamo più versatilità nella gestione dei parametri da passare in input alla funzione forEach. Di seguito verrà riportata la traccia di un esercizio basato sul foreach JavaScript che puoi provare a risolvere autonomamente.

Dato un array di numeri, per ogni elemento aggiungere un numero random. (Suggerimento: sfrutta la funzione Math.random built-in di JavaScript per generarne uno o, se ti piacciono le sfide, crea un secondo array di numeri su cui iterare per selezionare il numero random da aggiungere).

Ricorda che fare pratica nella programmazione è importante, specialmente per un aspirante web developer. Padroneggiare un linguaggio è un processo che richiede esercizio, esperienza ed approfondimento non solo del linguaggio di programmazione, ma proprio della logica che c’è alla base di ogni riga di codice. 

A tal proposito, se ti interessa dedicarti maggiormente allo studio del linguaggio Javascript, abbiamo scritto per te una guida Javascript in Italiano, da consultare ogni qualvolta tu ne senta il bisogno.

Articoli correlati

Il linguaggio HTML (Hypertext Markup Language) è uno dei più conosciuti e diffusi: lo si trova infatti praticamente in tutte le pagine web esistenti. È una scelta popolare tra i principianti che si…

Seguici su Facebook

Vuoi entrare nel mondo della programmazione?

Scopri di più sui nostri corsi!

Chiamaci al numero verde

Contattaci su WhatsApp

Contattaci senza impegno per informazioni sul corso

Pagamento rateale

Valore della rata: A PARTIRE DA 115 €/mese.

Esempio di finanziamento 

Importo finanziato: € 2440 in 24 rate da € 115 – TAN fisso 9,55% TAEG 12,57% – importo totale del credito € 2841.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

*In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Pagamento rateale

Valore della rata: A PARTIRE DA 210 €/mese.

Esempio di finanziamento  

Importo finanziato: € 4500 in 24 rate da € 210,03 – TAN fisso 9,68% TAEG 11,97% – importo totale del credito € 5146,55.

Il costo totale del credito comprende: interessi calcolati al TAN indicato, oneri fiscali (imposta di bollo sul contratto 16,00 euro*) addebitati sulla prima rata, costo mensile di gestione pratica € 3,90, spesa di istruttoria € 0,00, spesa per invio rendicontazione periodica cartacea € 0,98 (o spesa per invio rendicontazione periodica cartacea € 0,00), imposta di bollo su rendicontazione periodica € 0,00. Modalità di rimborso obbligatoria: addebito diretto su c/c. La scadenza delle rate è determinata dal giorno della liquidazione del contratto; la data di scadenza delle rate è prevista il giorno 15 del mese. L’importo di ciascuna rata comprende una quota di capitale crescente e interessi decrescente secondo un piano di ammortamento “alla francese”. Offerta valida dal 01/01/2024 al 31/12/2024.

Messaggio pubblicitario con finalità promozionale. Per le informazioni precontrattuali richiedere sul punto vendita il documento “Informazioni europee di base sul credito ai consumatori” (SECCI) e copia del testo contrattuale. Salvo approvazione di Sella Personal Credit S.p.A. Aulab S.r.l. opera quale intermediario del credito NON in esclusiva.

* In fase di richiesta del finanziamento verrà proposta la facoltà di selezionare, in alternativa all’imposta di bollo sul contratto di 16,00 euro, l’imposta sostitutiva, pari allo 0,25% dell’importo finanziato.

Contattaci senza impegno per informazioni sul corso

Scopriamo insieme se i nostri corsi fanno per te. Compila il form e aspetta la chiamata di uno dei nostri consulenti.