Gli array JavaScript consentono la creazione di un gruppo iterabile di valori che è possibile manipolare aggiungendo e rimuovendo elementi.

Sulla rimozione di elementi, non esiste un Array semplice.metodo di rimozione quindi, come si elimina un elemento da un array JavaScript?

L’array JavaScript ha una varietà di modi per eliminare i valori dell’array.,

Ci sono diversi metodi e tecniche che è possibile utilizzare per rimuovere elementi da un array JavaScript:

  • pop — Rimuove dalla Fine di un Array
  • shift — Rimuove dall’inizio di un Array
  • splice — rimuove da uno specifico indice di un Array
  • filtro — permette a livello di programmazione di rimuovere elementi da un Array

Potete anche imparare alcuni modi in cui è possibile rimuovere elementi da un array che può non essere così evidente, come con Lodash.,

Il modo più semplice per rimuovere uno o più elementi dalla fine da una matrice di elementi è impostando la proprietà length su un valore inferiore al valore corrente.

Qualsiasi elemento il cui indice è maggiore o uguale alla nuova lunghezza verrà rimosso.

Il “metodo pop” rimuove l’ultimo elemento dell’array, restituisce quell’elemento e aggiorna la proprietà length.,

Il “metodo pop” modifica l’array su cui viene invocato, questo significa che a differenza dell’utilizzo di delete, l’ultimo elemento viene rimosso completamente e la lunghezza dell’array ridotta.

Rimozione di elementi dall’inizio di un array JavaScript

Come si rimuove il primo elemento di un array JavaScript?

Il “metodo shift” funziona molto come il metodo pop, tranne che rimuove il primo elemento di un array JavaScript invece dell’ultimo.,

Non ci sono parametri poiché il metodo shift ha rimosso solo il primo elemento dell’array.

Quando l’elemento viene rimosso, gli elementi rimanenti vengono spostati verso il basso.

Il “metodo shift” restituisce l’elemento che è stato rimosso, aggiorna gli indici degli elementi rimanenti e aggiorna la proprietà length.

Se non ci sono elementi o la lunghezza dell’array è 0, il metodo restituisce undefined.,

Utilizzo dello Splice per rimuovere gli elementi dell’array in JavaScript

Il “metodo splice” può essere utilizzato per aggiungere o rimuovere elementi da un array.

Il primo argomento specifica la posizione in cui iniziare ad aggiungere o rimuovere elementi.

Il secondo argomento specifica il numero di elementi da rimuovere.

Il terzo e gli argomenti successivi sono facoltativi, specificano elementi da aggiungere all’array.,

Qui usiamo il metodo splice per rimuovere due elementi a partire dalla posizione tre (indice basato su zero):

Un array contenente gli elementi rimossi viene restituito dal “metodo splice”.

È possibile vedere l’array rimosso contiene e l’array originale contiene i valori rimanenti.

È anche possibile utilizzare questo metodo per rimuovere un intervallo di elementi da un array.,

Rimozione degli elementi dell’array in base al valore Utilizzando Splice

Se si conosce il valore che si desidera rimuovere da un array, è possibile utilizzare il “metodo splice”.

In primo luogo, è necessario identificare l’indice dell’elemento di destinazione.

Si utilizza quindi l’indice come elemento iniziale e si rimuove un solo elemento.

Questo è un semplice esempio in cui gli elementi sono interi.,

Se si dispone di una serie di oggetti, è necessaria una routine più sofisticata e funziona se si desidera rimuovere solo un singolo elemento.

Se vuoi rimuovere più elementi che corrispondono ai tuoi criteri, c’è un problema tecnico.

Quando gli elementi vengono rimossi dall’array, l’indice aumenta ancora e l’elemento successivo dopo che il valore corrispondente viene saltato.

La soluzione semplice è modificare l’esempio precedente per decrementare la variabile index in modo che non salti l’elemento successivo nell’array.,

Nell’esempio modificato ho aggiunto 2 ulteriori 5 valori all’array.

Ho anche aggiunto ‘i -;’ dopo la chiamata di splice.

Ora quando esegui il ciclo rimuoverà ogni elemento corrispondente.

Utilizzando il metodo del filtro Array per rimuovere gli elementi in base al valore

A differenza del “metodo splice”, “filter” crea un nuovo array.

filter() non muta l’array su cui viene chiamato, ma ne restituisce uno nuovo.,

filter () ha un singolo parametro, un metodo di callback che viene attivato quando il metodo filter itera attraverso gli elementi dell’array.

Passerà tre valori al callback: il valore o l’elemento corrente, l’indice dell’array corrente e l’array completo.

Il metodo di callback dovrebbe restituire true o false, è tua responsabilità testare il valore (elemento) per vedere se soddisfa i tuoi criteri, se lo fa, puoi restituire true.

Gli elementi che restituiscono true vengono aggiunti a un nuovo array filtrato.,

È necessario notare che viene restituito un nuovo array contenente valori corrispondenti, l’array originale rimane intatto.

Trovo questo utile perché spesso voglio mantenere un’origine dati originale, ma recuperare sottoinsiemi basati su diversi set logici.

Il metodo Lodash Array Remove

A volte le librerie di utilità sono il modo migliore per risolvere problemi più complessi.

Lodash fornisce un ricco set di metodi di manipolazione di array, uno per la rimozione di elementi.,

Il Lodash “remove method” funziona molto come l’array “filter method”, non salva i valori originali dell’array ma rimuove gli elementi corrispondenti e restituisce loro un nuovo array

Fare un metodo di rimozione

Ho detto prima, non esiste un array nativo.metodo di rimozione.

La libreria Lodash offre un metodo che risolve questo problema, ma potresti non voler sempre usare una libreria.

Ciò non significa che non sia possibile creare un metodo di utilità.,

Ho creato un metodo di utilità di rimozione Array che può essere aggiunto a un helper o una libreria di utilità.

Come il Lodash “remove method” il primo parametro è l’array di destinazione.

Utilizza Array.filtro per restituire elementi che non corrispondono a un valore.

Questo metodo è semplice, si assume valori semplici come i numeri o stringhe, è possibile modificare questo metodo per l’utilizzo di un metodo di confronto personalizzato, ma penso che sarebbe più semplice utilizzare solo il metodo a filtro direttamente.,

Rimuovere esplicitamente gli elementi dell’array utilizzando l’operatore Delete

È possibile rimuovere elementi specifici dell’array utilizzando l’operatore delete

L’utilizzo dell’operatore delete non influisce sulla proprietà length.

Né influisce sugli indici degli elementi successivi.

L’array diventa sparso, che è un modo elegante per dire che l’elemento eliminato non viene rimosso ma diventa indefinito.

L ‘” operatore elimina ” è progettato per rimuovere le proprietà dagli oggetti JavaScript, che gli array sono oggetti.,

Il motivo per cui l’elemento non viene effettivamente rimosso dall’array è che l ‘ “operatore di eliminazione” riguarda più la liberazione della memoria che l’eliminazione di un elemento.

La memoria viene liberata quando non ci sono più riferimenti al valore.

Cancella o ripristina un array JavaScript

Cosa succede se si desidera svuotare un intero array e scaricare tutti i suoi elementi?

Esistono un paio di tecniche che è possibile utilizzare per creare un array vuoto o nuovo.,

La tecnica più semplice e veloce è quella di impostare una variabile array su un array vuoto

Il problema che questo può creare è quando si hanno riferimenti alla variabile.

I riferimenti a questa variabile non cambieranno, manterranno comunque i valori dell’array originale.

Questo ovviamente può creare un bug 🐛.,

Questo è un esempio semplificato di questo scenario

Un semplice trucco per cancellare un array è impostare la sua proprietà length su 0.

Un’altra tecnica innaturale è quella di usare il “metodo splice”, passando la lunghezza dell’array come secondo parametro.,

Questo restituirà una copia degli elementi originari, che potrebbe essere utile per i tuoi scenario

Le ultime due tecniche non creare un nuovo array, ma modificare gli elementi dell’array, questo significa che i riferimenti dovrebbero essere aggiornati.

C’è un altro modo, usando un ciclo while, mi sembra un po ‘ strano, ma allo stesso tempo sembra elegante, quindi potrebbe impressionare alcuni amici!,

Non è un modo per cancellare un array JavaScript, ma funziona ed è leggibile.

Alcuni test delle prestazioni hanno anche dimostrato che questa è la tecnica più veloce, quindi forse è meglio di quanto pensassi inizialmente!

Riepilogo

La rimozione di elementi dell’array JavaScript è un’operazione che ha molte sfaccettature, dipende da dove e come si desidera rimuovere l’elemento.

Non è disponibile un singolo metodo di “rimozione”, ma esistono diversi metodi e tecniche che è possibile utilizzare per eliminare gli elementi di array indesiderati.,

Questo articolo ha esaminato questi metodi e come possono essere utilizzati e spero che tu abbia imparato un metodo che non conoscevi.

Grazie per la lettura!