Array in JavaScript

In quest’articolo affronteremo gli array in JavaScript, al fine di creare insiemi organizzati di dati omogenei. JavaScript, come tutti i linguaggi di programmazione, permette la creazione e la gestione degli array.

Definizione di array in JavaScript

Per definire un array si utilizza questa sintassi:

var foto=new Array();

Si sfrutta così l’oggetto Array().

All’interno di Array() si possono anche specificare il numero degli elementi.

Ma non c’è bisogno di usare il costruttore new per creare un oggetto, quindi si preferisce semplicemente scrivere:

var foto = [];

Inserimento dei dati in un array

I dati si possono inserire in più modi.

Primo metodo

var foto=new Array();

oppure, da preferire, var foto =[];

foto[0]=”img1.jpg”;

foto[1]=”img2.jpg”;

….

Secondo metodo

var foto=new Array(“img1.jpg”,”img2.jpg”,…);

Terzo metodo

var foto=[“img1.jpg”,”img2.jpg”,…];

Esempio di utilizzo di array in JavaScript

Facciamo subito un semplice esempio di utilizzo di array.

Ho inserito i giorni della settimana in un array e dopo li ho semplicemente stampati.

Creo dunque l’array in questo modo:

var giorni = [“lunedì”, “martedì”,”mercoledì”, “giovedì”, “venerdì”, “sabato”, “domenica”] ;

e poi lo leggo con un semplice ciclo for, utilizzando una delle proprietà più utilizzate dell’array che è lenght:

for (i=0; i<giorni.length; i++) {

document.write(giorni[i] + “<br>”);

}

Push() e Pop()

Per togliere o aggiungere elementi alla fine di un array in JavaScript posso utilizzare i metodi pop() e push().

Facciamo un esempio dimostrativo. Supponiamo ad esempio di avere i giorni della settimana da lunedì a domenica memorizzati in un array. Ogni volta che clicco sul pulsante sotto tolgo un giorno.

Fate pure la prova cliccando sul pulsante più volte.

Per inserire i dati nell'array giorni ho utilizzato il secondo metodo, che è quello che io preferisco.

Dopo uso il metodo pop() per eliminare i giorni dall'array quando faccio click sul pulsante tolgo giorno.

<script type="text/javascript">
var giorni=new Array("lunedì", "martedì","mercoledì", "giovedì", "venerdì", "sabato", "domenica") ; 

function tolgo() { 
    giorni.pop();
    alert("Ho tolto un giorno");
    for (var i = 0; i < giorni.length; i++) {
          alert(giorni[i]);
    }
}
</script>

E poi inserisco il pulsante che richiama la funzione tolgo().

<input type="submit" value="tolgo giorno" onclick="tolgo()">

Per inserire gli elementi in un array uso il metodo push().

Faccio un esempio puramente dimostrativo:

var giorni = ["lunedì"];
giorni.push("martedì");
giorni.push("mercoledì");
giorni.push("giovedì");
giorni.push("venerdì");
giorni.push("sabato");
giorni.push("domenica");

Alla fine avrò un array con tutti i giorni della settimana inseriti.

Shift() e Unshift()

Con shift() e unshift() tolgo e aggiungo un giorno all'inizio dell'array in javascript.

Facciamo un esempio come prima, ma questa volta toglieremo i giorni all'inizio dell'array, quindi iniziando da lunedì.

Ecco il codice completo:

<script type="text/javascript">

var giorni=["lunedì", "martedì","mercoledì", "giovedì", "venerdì", "sabato", "domenica"];

function tolgo() { 
giorni.pop();
alert("Ho tolto un giorno");
for (var i = 0; i < giorni.length; i++) {
alert(giorni[i]);
}
}
</script>
<input type="submit" value="tolgo giorno" onClick="tolgo()">

Allo stesso modo utilizzo unshift() per aggiungere elementi all'inizio dell'array.

var giorni=["lunedì"];
giorni.unshift("martedì");

Chiaramente questi sono solo dei semplici esempi per iniziare ad utilizzare gli array in JavaScript.

Alcuni link utili

Template responsive con html

Css Responsive

Come trovare immagini per il sito web

Quali colori scegliere per un sito web

Quali font scegliere per un sito web

Form in html

Tag strong

Collegamenti interni ad una pagina web