Array - Corso JavaScript

Indice dei contenuti

In questo articolo imparerai a creare e gestire gli array in JavaScript, a capire il loro funzionamento e in che modo possono essere usati in fase di programmazione.

Cosa sono gli array? Avrai sicuramente avuto modo di sentire questo nome in altre occasioni, forse ignorando che la funzione/strumento “array” può variare in base al campo o software in cui è presente.

Letteralmente “array” significa “serie“. Nome molto appropriato, poiché come strumento consente di creare e gestire in maniera semplificata una grande serie di dati/oggetti ripetuti.

Questa considerazione è valida per la maggior parte dei campi, come: progettazione CAD, 3D, grafica e programmazione.

In JavaScript troviamo gli array come uno strumento particolarmente utile e fondamentale da conoscere. Vedremo qui di seguito questo argomento in dettaglio.

Clicca qui per consultare il programma completo del corso JavaScript.

Array in JavaScript

Descrizione

Gli array in JavaScript, o in altri linguaggi di programmazione, permettono di memorizzare molteplici valori in una singola variabile.

Fino ad ora siamo abituati a pensare che una variabile funga da contenitore per un singolo valore (numerico, booleano o stringa che sia), in questo modo:

var miaVariabile = 100;

Per ogni valore futuro basterà creare nuove variabili e richiamarle all’interno del nostro codice.

Per capire l’utilità degli array adesso, poniamo questo caso:

var frutto1 = "mela";
var frutto2 = "pera";
var frutto3 = "arancia";

In questo esempio abbiamo creato tre variabili, ognuno di esse ha assegnato un nome di un frutto. In seguito ci basterà scrivere in nome di ogni singola variabile per riutilizzarla.

Ma se avessimo più di 100 frutti da creare?

Qui la situazione cambia, e anziché creare 100 variabili differenti (frutto1, frutto2… frutto100), possiamo creare una serie di valori indicandoli in una sola variabile, grazie agli arrays.

In maniera pratica (semplificata), lo stesso esempio di prima sarebbe tradotto così:

variabile frutti = mela, pera, arancia, limone, mandarino etc...

Per creare una serie (array) esistono due modi differenti, che vedremo qui di seguito.

Come ultima cosa non meno importante, l’uso degli arrays nel codice aiuta ad organizzare meglio i dati e le informazioni in meno righe.

Sintassi

Metodo 1

Un array è un metodo di gestione dei dati contenuti in una variabile. Ciò significa che per istituire un array va comunque creata anticipatamente una variabile.

Il primo metodo è con l’uso di due keywords: “new” e “Array“.

Vediamo un esempio:

var frutti = new Array("mela","pera","arancia");

Questa sintassi dichiara un array nominata frutti, che memorizza tre valori o elementi.

Per creare un array, va indicata la keyword “new” e poi “Array()“;
I valori sono dichiarati all’interno delle parentesi tonde, e divisi l’uno dall’altro dalla virgola (,);
Il numero di valori che possono essere contenuti nell’array è illimitato.

Altri esempi:

var Regioni = new Array("Lazio","Sardegna","Toscana","Marche","Liguria");

var Province = new Array("RM","AG","BL","MN","VA");

var Colori= new Array("Blu","Rosso","Giallo","Verde","Viola");

Metodo 2

Il secondo metodo è in un certo modo più semplice da scrivere, perché è simile al precedente ma non necessita di keywords esterne.

var Colori = ["Verde", "Bianco", "Nero"];

var Città = ["Firenze", "Roma", "Napoli", "Milano", "Genova", "Venezia"];

Non c’è nessuna differenza reale tra le due tipologie e si ottengono gli stessi risultati. Per semplicità d’uso e esecuzione si ricorre più spesso al secondo metodo.

Utilizzo

Ora che abbiamo capito come si crea un array in JavaScript, non ci resta che vedere come usare i valori contenuti a nostro piacere.

Per utilizzare i valori, dobbiamo avere a mente l’ordine con cui sono stati creati. Infatti dovremo fare riferimento al numero dell’indice di ognuno di essi.

Esempio:

var frutti = new Array("mela","pera","arancia");
document.write(frutti[1]);

// output = pera

Oppure:

var frutti = ["mela", "pera", "arancia"];
document.write(frutti[0]);

// output = mela

Si ricorda che il conteggio in JavaScript inizia dal valore 0 (zero); Per cui il primo valore avrà come indice “0”, il secondo “1” e così via.
L’indice è: mela = 0, pera = 1, arancia = 2.

L’indice del valore interessato va indicato tra le parentesi quadre [-], ogni numero corrisponderà al valore contenuto dell’array.

Se un indice non dovesse corrispondere ad alcun valore, verrà restituito “undefined” (non definito).

Un elemento contenuto in una serie (Array) può essere cambiato o sostituito da un altro in qualsiasi momento.

Il metodo di sostituzione è simile a quello delle variabili:

var dipendenti = new Array("Mario","Giacomo","Andrea","Fabrizio");
dipendenti[3] = "Maurizio";
document.write(dipendenti[3]);

//Maurizio

Ora non ti resta che provare a scrivere nuovi arrays ed imparare a gestire più elementi e dati contemporaneamente prima di passare al prossimo capitolo del corso.

Hai avuto difficoltà a capire l’argomento? Faccelo sapere nei commenti!

Programma completo del corso JavaScript

⇦ I cicli, for, while e do…while

Le funzioni ⇨

Iscriviti alla nostra Newsletter qui e seguici su Facebook per aggiornamenti!

Articoli recenti: