10 metodi degli array in JavaScript che dovresti conoscere

La memoria non è il mio forte e usando diversi linguaggi di programmazione non mi è facile ricordare i nomi esatti dei vari metodi. Anche perché se da un lato è vero che il mio amato Sublime, come molti altri editor, offre copiosi suggerimenti, se non sai con che lettera iniziare il nome il suggerimento è nullo. Ecco quindi il motivo per cui è importante ricordarsi a memoria almeno i nomi di questi 10 metodi degli array Javascript

Questo articolo ha lo stesso scopo del compito che a scuola la maestra ti assegna: “una paginetta di articoli determinativi”. E tu da bravo amanuense medievale ti mettevi lì con pazienza certosina a miniare le lettere e, attraverso la ripetizione, interiorizzavi la nozione.

Le basi

In JavaScript gli array sono una struttura di dati formata da una lista di valori di qualsiasi tipo. L’indice di un elemento di un array sta ad indicare la posizione che occupa nella struttura, partendo dal valore 0. Questo indice può essere utilizzato per ottenere il valore contenuto nella corrispondente posizione dell’array.

let cats = ["Sebastian", "Emmy", "Mr.Whiskers"]; 
console.log(cats[1]);
//stampa "Emmy"

I Metodi degli array in JavaScript

.push(elem)

aggiunge un elemento alla fine dell’array

let names = ["Nick", "Chris", "Ben"];
names.push("Rebecca"); 
console.log(names);
// names = ["Nick", "Chris", "Ben", "Rebecca]; 

.pop()

rimuove l’ultimo elemento da un array

let cities = ["New York", "Los Angeles", "Atlanta"]; 
cities.pop(); 
console.log(cities); 
// cities = ["New York", "Los Angeles"];

.shift()

rimuove il primo elemento di un array

let ages = [30, 26, 24, 20];
ages.shift(); 
console.log(ages);
// ages = [26, 24, 20]

.unshift(elem)

aggiunge un elemento all’inizio dell’array

let ages = [30, 26, 24, 20];
ages.unshift(60); 
console.log(ages);
// ages = [60, 30, 26, 24, 20];

.splice(index, qta, replace);

aggiunge, rimuove o sostituisce un elemento di un array in un dato indice. Il primo parametro è l’indice, il secondo è la quntità degli elementi che si vogliono rimuovere e il terzo indica il valore che si vuole sostituire o aggiungere.

// per rimuovere elementi
let animals = ["cat", "dog", "shark", "horse", "alligator"]; 
animals.splice(1, 2); 
// rimuove 2 elementi all'indice 1, incluso l'indice 1
// ciò che viene "spliced" è "dog" e "shark"
console.log(animals);
// animals  = ["cat", "horse", "alligator"];

// per aggiungere elementi
let animals = ["cat", "dog", "shark", "horse", "alligator"]; 
animals.splice(2, 0, "zebra"); 
// all'indice 2, splice 0 elementi, aggiungi "zebra" 
animals  = ["cat", "dog", "zebra", "shark", "horse", "alligator"]; 

// per sostituire elementi
let animals = ["cat", "dog", "shark", "horse", "alligator"]; 
animals.splice(2, 1, "zebra"); 
// all'indice 2, sostituisci 1 elemento ("shark") con "zebra"
animals  = ["cat", "dog", "zebra", "horse", "alligator"]; 

.slice(start, end)

ritorna un array composto da una parte dell’array di partenza con gli elementi compresi tra start e end. Se il secondo parametro è omesso, vengono inclusi nel range tutti gli elementi successivi all’indice start.

let colors = ["Blue", "Red", "Orange", "Purple", "Pink"];
let lessColors = colors.slice(1, 3);
console.log(lessColors); 
// colors = ["Red", "Orange"];

.forEach

esegue una funzione per ciascun elemento di un array

let miles = [1, 3, 5, 10];
let moreMiles = [];
miles.forEach(element => moreMiles.push(element + 10))
console.log(moreMiles);
// [11, 13, 15, 20];

.map

ritorna un array avente per elementi i risultati di una funzione applicata a ciascun elemento dell’array di partenza.

let population = [200, 600, 170, 100];
let doublePopulation = population.map(element => element * 2);
console.log(doublePopulation);       
// [400, 1200, 340, 200]

Anche se .map e .forEach possono sembrare simili, la loro differenza sta nel fatto che .map ritorna sempre un array, mentre forEach ritorna undefined e deve quindi costruire il suo risultato all’interno della funzione passata come valore.

.reduce

riduce l’array ad un singolo valore, iterando una funzione.

let ticketPrices = [99.54, 56.43, 122.94];
let totalCostOfTickets = ticketPrices.reduce((total, amount) => total + amount)
totalCostOfTickets = 278.91

.filter

restituisce un array formato da tutti gli elementi che ritornano true per la funzione definita.

let names = ["Rebecca", "Chris", "Ben", "Rachel"];
names = names.filter(name => name[0] === "R") 
console.log(names):
// names = ["Rebecca", "Rachel"];

src: https://dev.to/rebeccauranga/10-array-methods-you-should-know-nn5