PROGRAMMIAMO
JS - Array: metodi
Metodi degli array

In JS gli array sono oggetti e possiedono una serie di metodi predefiniti per mezzo dei quali possibile eseguire rapidamente una serie di operazioni su tutti gli elementi di un vettore. Come sappiamo i metodi di un oggetto sono azioni che possibile compiere sull'oggetto stesso e, dal punto di vista della sintassi, si utilizzano in pratica come delle funzioni.

Diamo dunque un'occhiata ai principali metodi degli array in Javascript.

 

Reverse

Il metodo reverse consente di invertire l'ordine degli elementi di un vettore. Si consideri l'esempio seguente:

var vocali = ["A", "E", "I", "O", "U"]; //crea un array contente le vocali
vocali.reverse(); //ora il vettore vocali contiene U O I E A

Si noti la sintassi di uso del metodo:

A differenza dell'esempio visto nella lezione precedente, il metodo reverse non visualizza gli elementi del vettore in ordine inverso, ma li inverte effettivamente. Qual'è la differenza? Nel primo caso il vettore non veniva modificato, ma cambiava solo l'ordine con cui veniva visualizzato il suo contenuto. Col metodo reverse invece, l'elemento zero conterrà il valore dell'ultimo elemento, l'elemento 1 quello del penultimo e così via.

Sort

Il metodo sort ordina il contenuto di un vettore secondo l'ordine alfabetico. Esempio:

var parole = ["oh", "che", "bel", "metodo", "questo"];
parole.sort();
//ora il vettore contiene: bel che metodo oh questo

Si presti attenzione al fatto che in JS le lettere minuscole seguono alfabeticamente le maiuscole. Perciò per esempio Zebra viene prima di airone in ordine alfabetico!

Concat

Il metodo concat concatena due vettori in modo da crearne un terzo che contiene tutti gli elementi del primo seguiti da tutti gli elementi del secondo:

var primo = ["alfa", "beta", "gamma"];
var secondo = ["delta", "epsilon"];
var terzo = primo.concat(secondo);
//terzo contiene: alfa beta gamma delta epsilon

Si presti attenzione alla sintassi del metodo:

Push

Il metodo push aggiunge un elemento in fondo al vettore (dopo l'ultimo inserito). Esempio:

var primo = [];
primo[0]="alfa";
primo[1]="beta";
primo.push("gamma");
//equivale a scrivere: primo[2] = "gamma"

Se interessa, il metodo push restituisce la nuova lunghezza del vettore. Esempio:

var primo = [];
primo[0]="alfa";
primo[1]="beta";
nuova = primo.push("gamma");
alert(nuova); //visualizza il valore 3

 

Pop

Il metodo pop elimina un elemento dal fondo del vettore. Esempio:

var vettore = [];
vettore[0]="alfa";
vettore[1]="beta";
vettore[2] = "gamma";
vettore.pop();

Il metodo pop cancella l'ultimo elemento del vettore (l'elemento 3 contenente "gamma" nell'esempio precedente) e decrementa la lunghezza length di uno.

Volendo pop restituisce il valore dell'elemento cancellato come valore di ritorno:

var vettore = [];
vettore[0]="alfa";
vettore[1]="beta";
vettore[2] = "gamma";
ultimo = vettore.pop();
alert(ultimo); //visualizza il valore "gamma"

 

Shift

Il metodo shift è identico al metodo pop, solo che elimina (e restituisce) il primo elemento del vettore:

var vettore = [];
vettore[0]="alfa";
vettore[1]="beta";
vettore[2] = "gamma";
vettore.shift();

Il risultato del programma precedente è che l'elemento zero ("alfa") viene eliminato e il nuovo elemento zero diventa "beta". La lunghezza length del vettore viene decrementata di uno.

Slice

Il metodo slice serve per copiare una porzione di array in un altro array. Esempio:

var vocali = ["A", "E", "I", "O", "U"];
var centrali = vocali.slice(1,4); //ora centrali contiene E I O

Si noti che il metodo slice copia a partire dal primo elemento (1 nell'esempio precedente) fino al secondo elemento escluso (fino a 3 nel precedente esempio).

Il metodo slice può anche essere usato per copiare un intero array su un altro. In questo caso bisogna usarlo senza nessun parametro fra parentesi:

var vettore = [];
vettore[0]="alfa";
vettore[1]="beta";
vettore[2] = "gamma";
var copia = vettore.slice(); //copia contiene gli stessi elementi di vettore

 

IndexOf

Il metodo indexOf serve per cercare un elemento in un array. Esempio:

var frutta = ["Banana", "Arancia", "Mela", "Mango"];
var ris = frutta.indexOf("Mela");

La variabile ris alla fine dell'esempio precedente contiene la posizione di Mela all'interno del vettore (nel nostro caso il valore è 2, perché Mela ha indice 2, cioè occupa la terza posizione nel vettore).

Se il valore cercato non è presente nel vettore, indexOf torna il valore -1. Nel caso ci siano più valori uguali nel vettore, indexOf torna la posizione solo del primo valore incontrato.

Il metodo indexOf possiede un secondo parametro opzionale in cui è possibile specificare l'indice a partire dal quale bisogna effettuare la ricerca (se si indica il valore 0 la ricerca viene effettuata a partire dal primo elemento). In questo modo è possibile ricercare tutte le occorrenze di un dato valore in un vettore (e non solo la prima), come mostra l'esempio seguente:

var frutta = ["Banana", "Arancia", "Mela", "Mango","Mela"];
var indice = -1;
do
{
indice = frutta.indexOf("Mela", indice+1);
alert(indice);
}
while (indice!=-1);

In questo esempio l'alert visualizza prima il valore 2 (prima posizione di "Mela" nel vettore), quindi il valore 4 (seconda posizione di "Mela" nel vettore) e infine il valore -1 (che termina il ciclo).

 

Cancellare un elemento: delete e splice

L'operatore delete, come suggerisce il nome, serve per cancellare un elemento da un array:

var frutta = ["Banana", "Arancia", "Mela", "Mango"];
delete frutta[0]; // rimuove il primo elemento di frutta

Si osservi che delete non un metodo, ma un operatore. Occorre anche notare che delete non elimina davvero l'elemento cancellato, ma lascia al suo posto una sorta di elemento vuoto, di valore undefined.

Per cancellare davvero un elemento (spostando tutti gli elementi successivi all'indietro di una posizione) si pu usare il metodo splice (da non confondere con slice visto sopra) nel seguente modo:

var frutta = ["Banana", "Arancia", "Mela", "Mango"];
frutta.splice(0, 1);  // rimuove il primo elemento di frutta

Il primo parametro 0 indica l'elemento da eliminare; il secondo parametro 1 indica quanti elementi devono essere eliminati.

 

precedente - successiva

Sito realizzato in base al template offerto da

http://www.graphixmania.it