Introduzione ai metodi di array in JavaScript
Javascript offre array per contenere dati come numeri interi, stringhe e oggetti definiti dall'utente. Lo scenario del caso d'uso è simile al concetto di array che troviamo in altre lingue. In questo argomento, impareremo i metodi di array in JavaScript.
Javascript è un linguaggio front-end che aggiunge un comportamento dinamico a una pagina Web, questi array vengono utilizzati per contenere i dati da renderizzare nella pagina Web, come se avessi un elenco di libri con il loro nome, nome dell'autore, data di pubblicazione e costo, quindi questo tutto può essere posizionato in un oggetto e tali oggetti multipli generati nel frattempo possono essere memorizzati in questi array che possono essere passati al controller per l'elaborazione o allo stesso modo il controller può inviarlo alla vista per il rendering.
La dichiarazione di matrice in Javascript viene eseguita in questo modo
var arr = new Array();
o
var arr=();
o
var arr = (1, 2, 3, 4);
Qui puoi vedere una cosa a cui abbiamo dato valori interi alla matrice e l'abbiamo contrassegnata come di tipo var, in Javascript tutti gli elementi verranno archiviati solo con il tipo var e se devono essere trattati e numeri interi o altrimenti tipi di dati che vedi sembrano come, quindi l'analisi in quel tipo deve essere fatta durante l'uso dei dati dall'array.
Metodi di array in Javascript
Per l'elaborazione dei dati dell'array sono disponibili più metodi, che ci aiuteranno a eseguire alcune operazioni richieste durante l'elaborazione e la manipolazione dei dati.
1. Foreach
Questo metodo viene utilizzato per eseguire il loop dei dati dell'array e possiamo visualizzare ogni singolo elemento nel segnaposto desiderato nella pagina Web.
var country = ('India', 'Australia', 'South Africa');
ripeteremo dall'indice 0 alla lunghezza-1, dove la lunghezza è la dimensione dell'array, che è 3 qui.
Ora ripetiamoli usando il metodo forEach -
Esempio
var country = ('India', 'Australia', 'South Africa');
country.forEach(function(indexElement, index, array)
(
console.log(indexElement, index);
) );
Produzione -
2. Premere
Ogni volta che si dispone di un array esistente e, nel frattempo, si esegue un calcolo in cui tale array riceverà probabilmente un valore di dati da aggiungere ad esso. In tal caso deve essere utilizzata la funzione push.
Aggiungiamo un paese all'elenco sopra definito e questa volta lo ripeteremo e verrà visualizzata anche la lunghezza modificata.
Ricorda che il push verrà eseguito all'ultimo indice disponibile nell'array.
Esempio
// this line gives current length ie 3
console.log(country.length + ' is current length')
// here we push one more country
country.push('USA')
//print updated length
console.log(country.length + ' is current length')
// print each element and index
country.forEach(function(indexElement, index, array)
(
console.log(indexElement, index);
) );
Produzione -
3. Pop
Possiamo anche avere un requisito in cui è necessario eliminare gli elementi di dati dall'array, pop viene utilizzato per eliminare l'elemento dalla fine dell'array, ovvero l'ultimo elemento dell'array verrà eliminato e così via.
Facciamo un esempio per vedere lo stesso -
// this line gives current length ie 4
console.log(country.length + ' is current length')
// pop the last element, it doesn't take any argument
Country.pop()
// this line gives current length ie 3, as the array lost one element
console.log(country.length + ' is current length')
Produzione -
4. Maiusc ()
Potresti avere un requisito in cui devi rimuovere l'elemento dalla parte anteriore dell'array, quindi non puoi usare pop per quello poiché eliminerà prima tutti i tuoi dati e poi ti farà raggiungere il tuo primo elemento, per questo abbiamo spostato () metodo, questo rimuoverà direttamente l'elemento dall'inizio dell'array.
Vediamo un esempio qui sotto per questo -
Qui eseguiremo il ciclo forEach per mostrare quale elemento è stato eliminato.
// line below will remove India, which was the first element
country.shift() ;
//let's print the elements now
country.forEach(function(indexElement, index, array)
(
console.log(indexElement, index);
) );
Produzione -
Nell'immagine sopra, puoi vedere che l'intero array è stato effettivamente spostato a sinistra l'elemento "Australia" si è spostato dall'indice 1 all'indice 0. Quindi questa operazione porta allo spostamento di tutti gli elementi dell'array e può essere costosa quando il i dati sono davvero enormi, quindi devono essere utilizzati con un'analisi adeguata e devono essere seguite le giuste tecniche di codifica.
5. Unshift ()
Qui il requisito è quello di aggiungere i dati all'inizio dell'array, piuttosto che aggiungerne alla fine, questo metodo è chiamato unshift () e questo aggiungerà anche un overhead di spostare tutti gli elementi uscenti dell'array a destra di uno indice in un'operazione di inserimento.
Questo può anche rivelarsi un'operazione costosa quando le prestazioni devono essere alla pari.
Vediamo un esempio su come eseguire questo spostamento:
Vedere l'indice in cui l'elemento di nuova aggiunta "Canada" appare nell'istantanea.
//add Canada
country.unshift('Canada');
//print elements
country.forEach(function(indexElement, index, array)
(
console.log(indexElement, index);
) );
Produzione -
6. Giunzione
Questo metodo viene utilizzato per rimuovere gli elementi in base a qualche indice passato dall'utente, fino a quel momento abbiamo visto push and pop, shift e unshift, quelli tutti trattati con gli ultimi e primi indici, se dovessimo fare un'operazione di rimozione con indici medi allora abbiamo bisogno del metodo splice e possiamo passare l'indice degli elementi da rimuovere dall'array.
Facciamo un esempio in cui abbiamo dato un indice iniziale da cui in poi tutti gli elementi devono essere rimossi dall'array.
Ho aggiunto la Nuova Zelanda all'array esistente e ne ho ripristinato la dimensione 4.
//the following statement will target index 2 and 3 to be removed.
country.splice(2), /code>
Produzione -
7. isArray ()
Questo metodo controlla se una variabile è di tipo array o meno.
Facciamo questo dalla seguente istantanea
Conclusione
Qui abbiamo visto diversi metodi per la manipolazione dei dati con JavaScript, che è utile quando sviluppi giochi o sviluppi pagine Web.
Articoli consigliati
Questa è una guida ai metodi di array in JavaScript. Qui discutiamo più metodi che ci aiuteranno ad eseguire alcune operazioni che sono necessarie durante l'elaborazione e la manipolazione dei dati. Puoi anche dare un'occhiata ai seguenti articoli per saperne di più -
- Costruttore in JavaScript
- Matrici in JavaScript
- Che cos'è JavaScript?
- Sostituzione in JavaScript
- Matrici in PHP