Lavorare con gli array in JavaScript è un'operazione che spesso si può riassumere con la frase "è una faticaccia". Il motivo spesso è da ricercarsi nella mancanza di funzionalità per la manipolazione degli stessi all'interno di ES (EcmaScript). A questo proposito esistono varie librerie come Lodash e Underscore.js che implementano le principali e più comuni operazioni. Tuttavia, con l'evoluzione del linguaggio molte di queste operazioni possono essere svolte senza nessun aiuto esterno, vediamone qualche esempio.
Per creare un array di N elementi spesso si ricorre all'utilizzo di un ciclo che consente di inserire una data quantità di elementi. Per raggiungere lo stesso scopo possiamo utilizzare i metodi fill e from
// Creo un array con 3 '0' // [0,0,0] Array(3).fill(0) Array.from(Array(3),()=>0) // utilizzo l'index per creare un array con numeri crescenti // [1,2,3] Array.from(Array(3),(_,index)=>index) // array con numeri casuali Array.from(Array(3),Math.random)
Prendendo come riferimento l'ultimo array, se volessimo avere il penultimo elemento dovremmo usare la lunghezza dell'array e da questa togliere 2. Usando il metodo at, possiamo arrivare allo stesso risultato utilizzando un indice negativo.
console.log(array[array.length -2]) console.log(array.at(-2))
Nel momento in cui poi andiamo a modificare un elemento della lista, inserendo in questo caso un numero con molte cifre, possiamo utilizzare il carattere _ come separatore visivo, che a livello di codice non è interpretato, rendendo lo stesso molto più leggibile.
array[2]= 10000000; array[2]= 10_000_000;
Durante la creazione di un array con numeri casuali può capitare di trovare dei doppioni. Per eliminarli si potrebbe creare un doppio loop sull'array: per ogni elemento scorre la lista alla ricerca di uno simile, seppur funzionale possiamo far uso dell'oggetto Set.
let array = [1, 2, 1]; let array1 = new Set(array); // [1,2]
A volte abbiamo la necessità di convertire un array in un oggetto o viceversa. Le operazioni richiedono l'utilizzo di un ciclo che iterando su ogni elemento o proprietà, converte la tipologia di oggetto. Entrambe le operazioni possono essere scritte in una sola riga.
// da array ad oggetto let arr = [1, 2, 3]; let arrObject = {}; for (let i = 0; i < arr.length; ++i) { arrObject<i> = arr<i>; } let arrObject = {...arr}; // {0:1,1:2,2:3} // da oggetto ad array let number = { one: 1, two: 2, }; let keys = []; for (let numbers in numbers) { if (number.hasOwnProperty(number)) { keys.push(number); } } // [ 'one', 'two' ] let key = Object.keys(number); // key = [ 'one', 'two' ] let value = Object.values(number); // value = [ 1, 2 ] let entry = Object.entries(number); // entry = [['one' : 1], ['two' : 2]]
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Eseguire attività pianificate con Azure Container Jobs
Creare un'applicazione React e configurare Tailwind CSS
Controllare gli accessi IP alle app con Azure Container Apps
Creare form tipizzati con Angular
Ottimizzare il mapping di liste di tipi semplici con Entity Framework Core
Utilizzare le Cache API di JavaScript per salvare elementi nella cache del browser
Paginare i risultati con QuickGrid in Blazor
Definire stili a livello di libreria in Angular
Usare un KeyedService di default in ASP.NET Core 8
Short-circuiting della Pipeline in ASP.NET Core
Sostituire la GitHub Action di login su private registry
Personalizzare l'errore del rate limiting middleware in ASP.NET Core
I più letti di oggi
- Miglioramenti nelle performance di Angular 16
- Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
- HTML5 con CSS e JavaScript
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Ottimizzazione dei block template in Angular 17
- Disabilitare automaticamente un workflow di GitHub (parte 2)