Rimuovere Elementi Da un Array JavaScript

array JavaScript consentono di valori del gruppo e scorrere su di loro. È possibile aggiungere e rimuovere elementi dell’array in modi diversi. Sfortunatamente non esiste un Array semplice.metodo di rimozione.

Quindi, come si elimina un elemento da un array JavaScript?,

Invece di un metodo di eliminazione, l’array JavaScript ha una varietà di modi per pulire i valori dell’array.

È possibile rimuovere elementi dalla fine di un array usando pop, dall’inizio usando shift o dal centro usando splice. Il metodo JavaScript Array filter per creare un nuovo array con gli elementi desiderati, un modo più avanzato per rimuovere gli elementi indesiderati.,lecitamente Rimuovere Elementi da un Array Utilizzando l’Operatore Delete

  • Cancella o il Reset di un Array JavaScript
  • Sommario
  • 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.,

    Rimozione di elementi dalla fine di un array JavaScript

    Gli elementi dell’array JavaScript possono essere rimossi dalla fine di un array impostando la proprietà length su un valore inferiore al valore corrente. Qualsiasi elemento il cui indice è maggiore o uguale alla nuova lunghezza verrà rimosso.

     var ar = ; ar.length = 4; // set length to remove elements console.log( ar ); // 

    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.,

     var ar = ; ar.pop(); // returns 6 console.log( ar ); // 

    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.,

     var ar = ; ar.shift(); // returns "zero" console.log( ar ); // 

    Il metodo shift restituisce l’elemento che è stato rimosso, aggiorna gli indici degli elementi rimanenti e aggiorna la proprietà length. Modifica l’array su cui viene invocato.

    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 gli elementi da aggiungere all’array.

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

     var arr = ; var removed = arr.splice(2,2); 

    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.

    Il metodo splice può anche essere usato per rimuovere un intervallo di elementi da un array.,

     var list = ; list.splice(0, 2); // Starting at index position 0, remove two elements and retains .

    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. Innanzitutto è necessario identificare l’indice dell’elemento di destinazione. Quindi si utilizza l’indice come elemento iniziale e si rimuove un solo elemento.

     var arr = ; for( var i = 0; i < arr.length; i++){ if ( arr === 5) { arr.splice(i, 1); } } //=> 

    Questo è un semplice esempio in cui gli elementi sono interi. Se hai una serie di oggetti avresti bisogno di una routine più sofisticata.

    Funziona se si desidera rimuovere solo un singolo elemento., Se si desidera rimuovere più elementi che corrispondono ai 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.

     var arr = ; for( var i = 0; i < arr.length; i++){ if ( arr === 5) { arr.splice(i, 1); i--; } } //=> 

    Nell’esempio modificato ho aggiunto 2 ulteriori 5 valori all’array. Ho anche aggiunto ‘i–;’ dopo la chiamata di giunzione.

    Ora quando esegui il ciclo rimuoverà ogni elemento corrispondente.,

    Grazie a Kristian Sletten per aver sottolineato il problema con il ciclo saltando il seguente elemento.

    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 restituisce un nuovo array.

    filter () ha un singolo parametro, un metodo di callback. Il callback 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 deve restituire true o false. È tua responsabilità testare il valore (elemento) per vedere se soddisfa i tuoi criteri. Se lo fa si può tornare vero. Gli elementi che restituiscono true vengono aggiunti al nuovo array filtrato.

     var array = ; var filtered = array.filter(function(value, index, arr){ return value > 5; }); //filtered => //array => 

    È necessario notare che viene restituito un nuovo array contenente valori corrispondenti. L’array originale è rimasto 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 degli array, uno dei quali è remove.

    Il metodo Lodash remove funziona molto come il metodo array filter, ma in senso inverso. Non salva i valori dell’array originale, ma rimuove gli elementi corrispondenti. Restituisce gli elementi corrispondenti come un nuovo array.

    var array = ;var evens = _.remove(array, function(n) { return n % 2 === 0;});console.log(array);// => console.log(evens);// => 

    Fare un metodo di rimozione

    Come ho menzionato prima, non esiste un array nativo.metodo di rimozione., Il metodo Lodash risolve questo problema, ma potresti non voler sempre usare Lodash. Ciò non significa che non sia possibile creare un metodo di utilità. John Resig ci ha dato un modello da seguire, tuttavia ha esteso il prototipo di Array, che è una cattiva idea.

    Invece ho creato un metodo di utilità di rimozione Array che può essere aggiunto a un helper o una libreria di utilità. Come il metodo Lodash remove, il primo parametro è l’array di destinazione. Usa Array.filtro per restituire elementi che non corrispondono a un valore.

    Questo metodo è semplice, assume valori semplici come numeri o stringhe., È possibile modificare questo metodo per utilizzare un metodo customcomparison,ma penso che sarebbe più semplice utilizzare direttamente il metodo filter.

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

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

     var ar = ; delete ar; // delete element with index 4 console.log( ar ); // alert( ar ); // 1,2,3,4,,6

    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. Confrontare usando delete con il metodo splice descritto di seguito.,

    L’operatore delete è 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 delete 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:

    var ar = ;//do stuffar = ;//a new, empty array!

    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:

    var arr1 = ;var arr2 = arr1; // Reference arr1 by another variable arr1 = ; console.log(arr2); // Output 

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

    var ar = ;console.log(ar); // Output ar.length = 0;console.log(ar); // Output 

    Un’altra tecnica innaturale è quella di utilizzare il metodo splice, passando la lunghezza dell’array come 2 ° parametro. Questo restituirà una copia degli elementi originali, che potrebbe essere utile per il tuo scenario.

    var ar = ;console.log(ar); // Output ar.splice(0, ar.length);console.log(ar); // Output 

    Le ultime due tecniche non creano un nuovo array, ma modificano gli elementi dell’array. Ciò significa che anche i riferimenti dovrebbero essere aggiornati.

    C’è un altro modo, usando un ciclo while. Ci si sente un po ‘ strano per me, ma allo stesso tempo sembra di fantasia, in modo che possa impressionare alcuni amici!,

    var ar = ;console.log(ar); // Output while (ar.length) { ar.pop(); }console.log(ar); // Output 

    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 originariamente!

    Riepilogo

    La rimozione di elementi dell’array JavaScript è importante per la gestione dei dati. Non è disponibile un singolo metodo “rimuovi”, 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., Hai anche visto come creare un metodo di supporto che rende la rimozione di elementi da un array un po ‘ più semplice e coerente.

    Grazie a Rob Sherwood per aver sottolineato alcuni errori di battitura sintattici!