Gli array, come abbiamo visto nella lezione precedente, sono oggetti che possono contenere una lista di valori. In questa lezione vediamo i diversi metodi degli array.
Lista completa dei metodi
Ecco la lista completa di tutti i metodi predefiniti in JavaScript per gli array.
Metodo | Descrizione |
concat() | Restituisce un nuovo array che combina gli elementi dell'array originale con uno o più array. |
constructor | Restituisce il tipo di funzione. |
copyWithin() | Copia e sovrascrive gli elementi all'interno dell'array. |
fill() | Restituisce l'array con tutti gli elementi sostituiti con un valore specificato. |
flat() | Riduce l'array annidato ad una data profondità, restituendo un nuovo array. |
from() | Crea un nuovo array da un oggetto simile ad un array o da un iterabile. |
indexOf() | Restituisce l'indice del primo elemento trovato nell'array, oppure -1 se non viene trovato. |
isArray() | Verifica se un valore o una variabile è un array. |
join() | Unisce gli elementi dell'array in una stringa, separati da un carattere specificato. |
lastIndexOf() | Restituisce l'ultimo indice in cui un determinato elemento viene trovato nell'array, oppure -1 se non viene trovato. |
length | Restituisce il numero di elementi presenti nell'array. |
of() | Crea un nuovo array contenente i valori specificati. |
pop() | Rimuove e restituisce l'ultimo elemento dell'array. |
push() | Aggiunge uno o più elementi alla fine dell'array e restituisce la nuova lunghezza dell'array. |
reverse() | Inverte l'ordine degli elementi dell'array. |
shift() | Rimuove e restituisce il primo elemento dell'array. |
slice() | Restituisce una copia superficiale di una porzione dell'array in un nuovo array. |
sort() | Ordina gli elementi dell'array in base all'ordine di classificazione. |
splice() | Modifica il contenuto di un array rimuovendo, sostituendo o aggiungendo elementi. |
toString() | Restituisce una stringa rappresentante gli elementi dell'array separati da virgole. |
unshift() | Aggiunge uno o più elementi all'inizio dell'array e restituisce la nuova lunghezza dell'array. |
Metodi più importanti
I metodi degli array sono diversi. Per prima cosa, vediamo quali sono i 10 metodi più importanti da conoscere:
length
push()
pop()
shift()
concat()
splice()
indexOf()
join()
slice()
isArray()
Vediamo ora questi metodi in dettaglio.
La proprietà length
Come abbiamo visto anche per le stringhe, la proprietà length
restituisce la lunghezza dell'array, ovvero il numero di elementi contenuti.
let array = ["a", "b", "c", "d"];
alert(array.length); // Risultato: 4
Il metodo push()
Il metodo push()
aggiunge uno o più elementi alla fine dell'array e restituisce la nuova lunghezza dell'array.
Sintassi: array.push(
elemento1,
elemento2,
...)
.
let array = ["a", "b", "c", "d"];
let lunghezza = array.push("e", "f", "g")
console.log(array); // Risultato: ["a", "b", "c", "d", "e", "f", "g"]
console.log(lunghezza); // Risultato: 7
Il metodo pop()
Il metodo pop()
rimuove l'ultimo elemento dall'array e lo restituisce.
Sintassi: array.pop()
.
let array = ["a", "b", "c", "d"];
let elemento_rimosso = array.pop()
console.log(array); // Risultato: ["a", "b", "c"]
console.log(elemento_rimosso); // Risultato: "d"
Il metodo shift()
Il metodo shift()
rimuove il primo elemento dall'array e lo restituisce.
Sintassi: array.shift()
.
let array = ["a", "b", "c", "d"];
let elemento_rimosso = array.shift()
console.log(array); // Risultato: ["b", "c", "d"]
console.log(elemento_rimosso); // Risultato: "a"
Il metodo concat()
Il metodo concat()
viene utilizzato per unire due o più array, creando un nuovo array contenente gli elementi di tutti gli array concatenati.
Sintassi: array1.concat(
array2,
array2)
.
let array1 = ["a", "b"];
let array2 = ["c", "d"];
let nuovo_array = array1.concat(array2)
console.log(nuovo_array); // Risultato: ["a", "b", "c", "d"]
Il metodo splice()
Il metodo splice()
modifica il contenuto di un array rimuovendo, sostituendo o aggiungendo elementi.
Sintassi: array.splice(
inizio,
fine,
elemento1,
elemento2,
...)
. L'inizio indica l'indice dopo cui l'array viene modificato. La fine indica il numero di elementi da eliminare dopo inizio; non è obbligatorio. Gli elemento1, elemento2, ... solo gli elementi da aggiungere dopo inizio; non sono obbligatori.
let array = [1, 2, 3, 4, 5];
array.splice(2, 1, "a", "b");
console.log(array); // Risultato: [1, 2, "a", "b", 4, 5]
Il metodo indexOf()
Il metodo indexOf()
restituisce l'indice della prima occorrenza di un elemento specifico nell'array. Se l'elemento non viene trovato, restituisce -1
. In caso contrario, restituisce la posizione dell'elemento.
Sintassi: array.indexOf(
elemento,
posizione_iniziale)
. L'elemento è l'elemento da cercare. La posizione_iniziale è la posizione da cui parte la ricerca; non è obbligatoria.
let array = ["a", 2, "c", "d", "c"];
let trovato = array.indexOf("c");
console.log(trovato); // Risultato: 2
Il metodo join()
Il metodo join()
unisce tutti gli elementi di un array in una stringa, utilizzando un carattere specificato.
Sintassi: array.join(
separatore)
.
let array = ["a", "b", "c"];
let nuovo_array = array.join(",");
console.log(nuovo_array); // Risultato: "a,b,c"
Il metodo slice()
Il metodo slice()
restituisce una copia di una porzione dell'array, specificata da un indice di inizio (incluso) e un indice di fine (escluso).
Sintassi: array.slice(
inizio,
fine)
. Se non viene specificato l'inizio, viene sottinteso 0. Se non viene specificata la fine, viene considerata la porzione fino alla fine dell'array.
let array = ["a", "b", "c", "d", "e"];
let nuovo_array = array.slice(1,3);
console.log(nuovo_array); // Risultato: ["b", "c"]
Il metodo isArray()
Il metodo isArray()
verifica se un oggetto è un array, restituendo true
o false
.
Sintassi: Array.isArray
(
elemento)
.
let array1 = ["a", "b", "c"];
let risultato1 = Array.isArray(array1);
alert(risultato1); // Risultato: true
let array2 = "JavaScript";
let risultato2 = Array.isArray(array2);
alert(risultato2); // Risultato: false
Altri metodi
Vediamo gli altri metodi disponibili per gli array in JavaScript.
La proprietà constructor
La proprietà constructor
restituisce il tipo di funzione dell'array.
let array = [1, 2, 3];
console.log(array.constructor); // Risultato: [Function: Array]
Il metodo copyWithin()
Il metodo copyWithin()
copia una sequenza di elementi all'interno dell'array, sovrascrivendo gli elementi esistenti.
Sintassi: array.copyWithin(
posizione,
inizio,
fine)
. La posizione indica la posizione dove copiare gli elementi. L'inizio indica il punto di inizio della sezione; non è obbligatorio (se omesso, si sottintende 0). La fine (esclusa) indica il punto di fine della sezione; non è obbligatoria (se omessa, si sottintende fino alla fine dell'array).
let array = ["A", "B", "C", "D", "E"];
// La sezione viene inserita all'inizio dell'array (0)
// L'inizio della sezione copiata parte dalla posizione 3 ("D")
// La fine della sezione copiata è nella posizione 5 (non inclusa)
array.copyWithin(0, 3, 4);
console.log(array); // Risultato: ["D", "E", "C", "D", "E"]
Il metodo fill()
l metodo fill()
modifica tutti gli elementi dell'array con un valore, a partire dall'indice di inizio fino all'indice di fine (escluso).
Sintassi: array.fill(
valore,
inizio,
fine)
. Il valore indica l'elemento con cui riempire l'array. L'inizio indica il punto di inizio della sezione da sostituire; non è obbligatorio (se omesso, si sottintende 0). La fine (esclusa) indica il punto di fine della sezione da sostituire; non è obbligatoria (se omessa, si sottintende fino alla fine dell'array).
let array = ["A", "B", "C", "D", "E"];
// L'inizio della sezione parte dalla posizione 1 ("B")
// La fine della sezione è nella posizione 3 ("D")
array.copyWithin("O", 1, 3);
console.log(array); // Risultato: ["A", "O", "O", "D", "E"]
Il metodo flat()
Il metodo flat()
crea un nuovo array con tutti gli elementi di array concatenati fino a una determinata profondità.
Sintassi: array.flat(
profondità)
.
let array = [1, 2, [3, 4, [5, 6]]];
let nuovo_array = array.flat(1);
console.log(nuovo_array); // Risultato: [1, 2, 3, 4, [5, 6]]
Il metodo from()
Il metodo from()
crea un nuovo array da un oggetto o una stringa.
Sintassi: Array.from(
stringa)
.
let stringa = "PHP";
let array = Array.from(stringa);
console.log(array); // Risultato: ["P", "H", "P"]
Il metodo lastIndexOf()
Il metodo lastIndexOf()
restituisce l'indice dell'ultima occorrenza di un elemento specifico nell'array. Se l'elemento non viene trovato, restituisce -1
. In caso contrario, restituisce la posizione dell'elemento.
Sintassi: array.lastIndexOf(
elemento,
posizione_iniziale)
. L'elemento è l'elemento da cercare. La posizione_iniziale è la posizione da cui parte la ricerca; non è obbligatoria.
let array = ["a", "d", "c", "d"];
let trovato = array.lastIndexOf("d");
console.log(trovato); // Risultato: 3
Il metodo of()
Il metodo of()
crea un nuovo array con gli elementi specificati come argomenti.
Sintassi: Array.of(
elemento1,
elemento2,
...)
.
let array = Array.of("A", "B", "C");
console.log(array); // Risultato: ["A", "B", "C"]
Il metodo reverse()
Il metodo reverse()
inverte l'ordine degli elementi dell'array.
Sintassi: array.reverse()
.
let array = [1, 2, 3, 4];
array.reverse();
console.log(array); // Risultato: [4, 3, 2, 1]
Il metodo sort()
Il metodo sort()
ordina gli elementi dell'array in base all'ordine numerico o alfabetico.
Sintassi: array.sort()
.
let numeri = [3, 2, 4, 1];
numeri.sort();
console.log(numeri); // Risultato: [1, 2, 3, 4]
let parole = ["Pesce", "Gatto", "Cane", "Scoiattolo"];
parole.sort();
console.log(parole); // Risultato: ["Cane", "Gatto", "Pesce", "Scoiattolo"]
Il metodo toString()
Il metodo toString()
restituisce un array convertito in stringa, in cui gli elementi dell'array sono separati da virgola.
Sintassi: array.toString()
.
let array = [1, 2, 3, 4];
array.toString();
console.log(array); // Risultato: "1,2,3,4"
Il metodo unshift()
Il metodo unshift()
aggiunge uno o più elementi all'inizio dell'array e restituisce la nuova lunghezza dell'array.
Sintassi: array.unshift(
elemento1,
elemento2,
...)
.
let array = [2, 3, 4, 5];
let lunghezza = array.unshift(1);
console.log(array); // Risultato: [1, 2, 3, 4, 5]
console.log(lunghezza); // Risultato: 5