Array multidimensionali in Javascript

Introduzione

Nella guida a Javascript del sito abbiamo visto cosa sono gli array (veli la lezione) e li abbiamo trattati nel loro aspetto più semplice, ovvero quello monodimensionale (a dimensione singola).

Tratteremo adesso gli array multidimensionali e vedremo un esempio di implementazione di un array bidimensionale e di un array tridimensionale in Javascript.

Array monodimensionali

Lo scopo di avere array a più dimensioni è quello di costruire gabbie complesse di dati e non semplici schemi logici a cui siamo abituati, ovvero la stessa filosofia che seguono i database relazionali.

Un array monodimensionale ha il seguente aspetto:

var mio_array = new Array();

e possiamo popolarlo come segue:

mio_array[0] = "Valore 1";
mio_array[1] = "Valore 2";
mio_array[2] = "Valore 3";

e cosi via, e possiamo accedere al suo valore semplicemente richiamando l’item dell’array desiderato:

alert(mio_array[0]);

restituisce:

Valore 1

Array multidimensionali

Abbandoniamo per un attimo questo concetto e vediamo come popolare un array multidimensionale:

var mio_array = new Array();

mio_array[0] = new Array();
mio_array[1] = new Array();

In questo modo ricreiamo degli array sulla scorta degli item dell’array madre.

Array bidimensionali

La sintassi per popolare un array bidimansionale è la seguente:

mio_array[0][0] = "Primo array, prima voce.";
mio_array[0][1] = "Primo array, seconda voce.";
mio_array[0][2] = "Primo array, terza voce.";
mio_array[1][0] = "Secondo array, prima voce.";
mio_array[1][1] = "Secondo array, seconda voce.";
mio_array[1][2] = "Secondo array, terza voce.";

Adesso possiamo accedere ad un item di un array come segue:

alert(mio_array[0][0]);

restituisce:

Primo array, prima voce.

Vediamo adesso, attraverso un ciclo, come accedere a tutti gli item del nostro array multidimensionale:

var x = 0;
var y = 0;

for (x=0; x<mio_array[0].length; x++)
{
    for (y=0; y<mio_array[1].length; y++)
    {
        document.write(mio_array[x][y] + "<br>")
    }
}

restituisce:

Primo array, prima voce.
Primo array, seconda voce.
Primo array, terza voce.
Secondo array, prima voce.
Secondo array, seconda voce.
Secondo array, terza voce.

Trattandosi di un array bidimensionale abbiamo utilizzato un doppio ciclo.

Array tridimensionali

La stessa filosofia viene utilizzata per gli array tridimensionali, come vedremo adesso.

Vediamo quindi, modificando l’esempio precedente, come implementare un array a tre dimensioni. Evidenzierò in grassetto le fasi aggiuntive dell’esempio.

Innanzitutto dichiariamo l’array:

var mio_array = new Array();

mio_array[0] = new Array();
mio_array[1] = new Array();
mio_array[2] = new Array();

A questo punto lo popoliamo:

mio_array[0][0] = "Primo array, prima voce.";
mio_array[0][1] = "Primo array, seconda voce.";
mio_array[0][2] = "Primo array, terza voce.";
mio_array[1][0] = "Secondo array, prima voce.";
mio_array[1][1] = "Secondo array, seconda voce.";
mio_array[1][2] = "Secondo array, terza voce.";
mio_array[2][0] = "Terzo array, prima voce.";
mio_array[2][1] = "Terzo array, seconda voce.";
mio_array[2][2] = "Terzo array, terza voce.";

Una volta popolato l’array non ci resta che estrarre gli item con un ciclo, ma prima dichiariamo le variabili “contatore” che utilizzeremo per il ciclo:

var x = 0;
var y = 0;
var z = 0;

Passiamo alla nidificazione dei tre cicli utili allo scopo di estrarre i risultati:

for (x=0; x<mio_array[0].length; x++)
{
  for (y=0; y<mio_array[1].length; y++)
  {
    for (z=0; z<mio_array[2].length; z++)
    {
      document.write(mio_array[x][y][z] + "<br>")
    }
  }
}

Il risultato sarà:

Primo array, prima voce.
Primo array, seconda voce.
Primo array, terza voce.
Secondo array, prima voce.
Secondo array, seconda voce.
Secondo array, terza voce.
Terzo array, prima voce.
Terzo array, seconda voce.
Terzo array, terza voce.

Conclusioni

L’articolo che abbiamo proposto non è finalizzato ad offrire un esempio pratico di utilizzo degli array multidimensionali, ma torna utile solo come appendice puramente didattica della guida a Javascript del sito.

Ricordo inoltre che gli array (monodimensionali o multidimensionali che siano) sono tipi di dato, o di variabile che dir si voglia, molto pesanti in termini di consumo di risorse, quindi esorto il lettore a farne uso quando strettamente indispensabile.