Domanda Come rimuovo un particolare elemento da un array in JavaScript?


Ho una matrice di numeri interi e sto usando il .push() metodo per aggiungere elementi ad esso.

C'è un modo semplice per rimuovere un elemento specifico da un array? L'equivalente di qualcosa di simile array.remove(int);.

Devo usare nucleo  JavaScript - no  i quadri sono permessi.


6097
2018-04-23 22:17


origine


risposte:


Trovare il index dell'elemento dell'array che si desidera rimuovere, quindi rimuovere tale indice con splice.

Il metodo splice () modifica il contenuto di un array rimuovendo   elementi esistenti e / o aggiunta di nuovi elementi.

var array = [2, 5, 9];
var index = array.indexOf(5);
if (index > -1) {
  array.splice(index, 1);
}
// array = [2, 9]

Il secondo parametro di splice è il numero di elementi da rimuovere. Nota che splice modifica la matrice in posizione e restituisce una nuova matrice contenente gli elementi che sono stati rimossi.


Nota : supporto browser per indexOf  è limitato


8884
2018-04-23 22:23



Non so come ti aspetti array.remove(int) comportarsi. Ci sono tre possibilità che posso pensare che potresti volere.

Per rimuovere un elemento di una matrice in un indice i:

array.splice(i, 1);

Se si desidera rimuovere ogni elemento con valore number dall'array:

for(var i = array.length - 1; i >= 0; i--) {
    if(array[i] === number) {
       array.splice(i, 1);
    }
}

Se vuoi solo rendere l'elemento all'indice i non esiste più, ma non vuoi che gli indici degli altri elementi cambino:

delete array[i];

890
2018-04-23 22:20



Modificato il 2016 ottobre

  • Fallo semplice, intuitivo ed esplicito ( https://en.wikipedia.org/wiki/Occam%27s_razor )
  • Fallo immutabile (la matrice originale rimane invariata)
  • Fallo con le funzioni JS standard, se il tuo browser non le supporta - usa polyfill

In questo esempio di codice che uso "Array.filter (...)"  funzione per rimuovere gli elementi indesiderati dalla matrice, questa funzione non cambia la matrice originale e ne crea una nuova. Se il tuo browser non supporta questa funzione (ad esempio IE prima della versione 9 o Firefox prima della versione 1.5), considera l'utilizzo il filtro polyfill di Mozilla .

Rimozione dell'oggetto (codice ECMA-262 Edition 5 aka oldstyle JS)

var value = 3

var arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(function(item) { 
    return item !== value
})

console.log(arr)
// [ 1, 2, 4, 5 ]

Rimozione dell'oggetto (codice ES2015)

let value = 3

let arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(item => item !== value)

console.log(arr)
// [ 1, 2, 4, 5 ]

IMPORTANTE  ES2015 "() => {}" la sintassi della funzione freccia non è supportata in IE affatto, Chrome prima della versione 45, Firefox prima della versione 22, Safari prima della versione 10. Per utilizzare la sintassi ES2015 nei vecchi browser che è possibile utilizzare BabelJS


Rimozione di più elementi (codice ES2016)

Un ulteriore vantaggio di questo metodo è la possibilità di rimuovere più elementi

let forDeletion = [2, 3, 5]

let arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(item => !forDeletion.includes(item))
// !!! Read below about array.includes(...) support !!!

console.log(arr)
// [ 1, 4 ]

IMPORTANTE  La funzione "array.includes (...)" non è supportata in IE, Chrome prima della versione 47, Firefox prima della versione 43, Safari prima della versione 9 e Edge prima della versione 14, quindi ecco polyfill di Mozilla

Rimozione di più elementi (JavaScript ES2018 sperimentale all'avanguardia?)

// array-lib.js

export function remove(...forDeletion) {
    return this.filter(item => !forDeletion.includes(item))
}

// main.js

import { remove } from './array-lib.js'

let arr = [1, 2, 3, 4, 5, 3]

// :: This-Binding Syntax Proposal
// using "remove" function as "virtual method"
// without extending Array.prototype
arr = arr::remove(2, 3, 5)

console.log(arr)
// [ 1, 4 ]

Provalo tu stesso in BabelJS :)

Riferimento


668
2017-12-19 19:54



Dipende se vuoi mantenere un posto vuoto o no.

Se vuoi uno slot vuoto, cancella va bene:

delete array[ index ];

Se non lo fai, dovresti usare il giuntura  metodo:

array.splice( index, 1 );

E se hai bisogno del valore di quell'elemento, puoi semplicemente memorizzare l'elemento dell'array restituito:

var value = array.splice( index, 1 )[0];

Se vuoi farlo in qualche ordine, puoi usare array.pop() per l'ultimo o array.shift() per il primo (ed entrambi restituiscono anche il valore dell'oggetto).

E se non conosci l'indice dell'articolo, puoi usarlo array.indexOf( item ) per averlo (in a if() per ottenere un oggetto o in a while() per averli tutti). array.indexOf( item ) restituisce l'indice o -1 se non trovato.


356
2018-04-23 22:32



Un amico stava avendo problemi in Internet Explorer 8 e mi ha mostrato quello che ha fatto. Gli ho detto che era sbagliato, e lui mi ha detto di avere la risposta qui. La risposta top corrente non funzionerà in tutti i browser (ad esempio, Internet Explorer 8) e rimuoverà solo la prima occorrenza dell'elemento.

Rimuovi TUTTE le istanze da un array

function remove(arr, item) {
    for (var i = arr.length; i--;) {
        if (arr[i] === item) {
            arr.splice(i, 1);
        }
    }
}

Passa attraverso l'array all'indietro (poiché gli indici e la lunghezza cambieranno man mano che gli elementi vengono rimossi) e rimuove l'oggetto se viene trovato. Funziona su tutti i browser.


225
2017-08-10 19:21



Ci sono due approcci principali:

  1. splice () : anArray.splice(index, 1);

  2. Elimina : delete anArray[index];

Fai attenzione quando usi delete per un array. È utile cancellare gli attributi degli oggetti ma non è così buono per gli array. È meglio usare splice per gli array.

Tieni presente che quando usi delete per un array potresti ottenere risultati errati anArray.length. In altre parole, delete rimuoverà l'elemento ma non aggiornerà il valore della proprietà length.

Puoi anche aspettarti di avere buchi nei numeri indice dopo aver usato la cancellazione, ad es. si potrebbe finire con gli indici 1,3,4,8,9,11 e la lunghezza come prima di usare l'eliminazione. In tal caso, tutti indicizzati for i loop si arresterebbero in modo anomalo, poiché gli indici non sono più sequenziali.

Se sei costretto a usare delete per qualche ragione, quindi dovresti usare for each loop quando è necessario scorrere gli array. Di fatto, evitare sempre l'uso di cicli indicizzati, se possibile. In questo modo il codice sarebbe più robusto e meno soggetto a problemi con gli indici.


131
2017-12-21 11:32



Array.prototype.remByVal = function(val) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] === val) {
            this.splice(i, 1);
            i--;
        }
    }
    return this;
}
//Call like
[1, 2, 3, 4].remByVal(3);

Array.prototype.remByVal = function(val) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] === val) {
            this.splice(i, 1);
            i--;
        }
    }
    return this;
}

var rooms = ['hello', 'something']

rooms = rooms.remByVal('hello')

console.log(rooms)


103
2018-04-23 22:20



Non c'è bisogno di usare indexOf o splice. Tuttavia, si comporta meglio se si desidera rimuovere solo un'occorrenza di un elemento.

Trova e sposta (sposta):

function move(arr, val) {
  var j = 0;
  for (var i = 0, l = arr.length; i < l; i++) {
    if (arr[i] !== val) {
      arr[j++] = arr[i];
    }
  }
  arr.length = j;
}

Uso indexOf e splice (indice di):

function indexof(arr, val) {
  var i;
  while ((i = arr.indexOf(val)) != -1) {
    arr.splice(i, 1);
  }
}

Usare solo splice (Giunzione):

function splice(arr, val) {
  for (var i = arr.length; i--;) {
    if (arr[i] === val) {
      arr.splice(i, 1);
    }
  }
}

Run-time su nodejs per array con 1000 elementi (media su oltre 10000 esecuzioni):

indice di  è circa 10 volte più lento di mossa . Anche se migliorato rimuovendo la chiamata a indexOf in giuntura  si comporta molto peggio di mossa .

Remove all occurrences:
    move 0.0048 ms
    indexof 0.0463 ms
    splice 0.0359 ms

Remove first occurrence:
    move_one 0.0041 ms
    indexof_one 0.0021 ms

82
2017-09-19 01:53



Troppo vecchio per rispondere, ma può aiutare qualcuno, fornendo un predicato invece di un valore.

NOTA:  aggiornerà l'array specificato e restituirà le righe interessate

uso

var removed = helper.removeOne(arr, row => row.id === 5 );

var removed = helper.remove(arr, row => row.name.startsWith('BMW'));

Definizione

var helper = {

    // Remove and return the first occurrence     

    removeOne: function(array, predicate) {
        for (var i = 0; i < array.length; i++) {
            if (predicate(array[i])) {
                return array.splice(i, 1);
            }
        }
    },

    // Remove and return all occurrences  

    remove: function(array, predicate) {
        var removed = [];

        for (var i = 0; i < array.length;) {

            if (predicate(array[i])) {
                removed.push(array.splice(i, 1));
                continue;
            }

            i++;                
        }

        return removed;
    }
};

56
2018-05-02 12:00