Suchen Sie das index
Array-Element, das Sie mit entfernen möchten indexOf
, und entfernen Sie dann diesen Index mit splice
.
Die splice () -Methode ändert den Inhalt eines Arrays, indem vorhandene Elemente entfernt und / oder neue Elemente hinzugefügt werden.
const array = [2, 5, 9];
console.log(array);
const index = array.indexOf(5);
if (index > -1) {
array.splice(index, 1);
}
// array = [2, 9]
console.log(array);
Der zweite Parameter von splice
ist die Anzahl der zu entfernenden Elemente. Beachten Sie, dass splice
das vorhandene Array geändert wird und ein neues Array zurückgegeben wird, das die entfernten Elemente enthält.
Der Vollständigkeit halber sind hier Funktionen aufgeführt. Die erste Funktion entfernt nur ein einzelnes Vorkommen (dh das Entfernen der ersten Übereinstimmung von 5
von [2,5,9,1,5,8,5]
), während die zweite Funktion alle Vorkommen entfernt:
function removeItemOnce(arr, value) {
var index = arr.indexOf(value);
if (index > -1) {
arr.splice(index, 1);
}
return arr;
}
function removeItemAll(arr, value) {
var i = 0;
while (i < arr.length) {
if(arr[i] === value) {
arr.splice(i, 1);
} else {
++i;
}
}
return arr;
}
array.indexOf(testValue)
auf leerem Array ist -1, und wenn Sie darauf testen, dann kein Spleiß. Vielleicht hat sich die Antwort seitdem geändert.Ich weiß nicht, wie Sie sich
array.remove(int)
verhalten sollen. Ich kann mir drei Möglichkeiten vorstellen, die Sie sich wünschen könnten.So entfernen Sie ein Element eines Arrays an einem Index
i
:Wenn Sie jedes Element mit Wert
number
aus dem Array entfernen möchten :Wenn Sie nur möchten, dass das Element am Index
i
nicht mehr vorhanden ist, die Indizes der anderen Elemente jedoch nicht geändert werden sollen:quelle
delete
ist nicht der richtige Weg, um ein Element aus einem Array zu entfernen!array.hasOwnProperty(i)
zurückkehrtfalse
und das Element an dieser Position zurückgibtundefined
. Aber ich gebe zu, dass das nicht sehr häufig ist.delete
aktualisiert weder die Länge des Arrays noch löscht es das Element wirklich, sondern ersetzt es nur durch den speziellen Wertundefined
.undefined
: Es entfernt sowohl den Index und den Wert aus dem Feld, nachdem das heißtdelete array[0]
,"0" in array
wird falsch zurück.delete
tut, zu verstehen, warum er nicht wie erwartet funktioniert.Bearbeitet am Oktober 2016
In diesem Codebeispiel verwende ich die Funktion "array.filter (...)" , um unerwünschte Elemente aus einem Array zu entfernen. Diese Funktion ändert das ursprüngliche Array nicht und erstellt ein neues. Wenn Ihr Browser diese Funktion nicht unterstützt (z. B. Internet Explorer vor Version 9 oder Firefox vor Version 1.5), sollten Sie die Filter-Polyfüllung von Mozilla verwenden .
Element entfernen (ECMA-262 Edition 5-Code, auch bekannt als Oldstyle-JavaScript)
Element entfernen (ECMAScript 6-Code)
WICHTIG Die Pfeilfunktionssyntax von ECMAScript 6 "() => {}" wird in Internet Explorer überhaupt nicht unterstützt, Chrome vor Version 45, Firefox vor Version 22 und Safari vor Version 10. Um die ECMAScript 6-Syntax in alten Browsern zu verwenden, können Sie BabelJS verwenden .
Mehrere Elemente entfernen (ECMAScript 7-Code)
Ein zusätzlicher Vorteil dieser Methode besteht darin, dass Sie mehrere Elemente entfernen können
WICHTIG Die Funktion "array.includes (...)" wird in Internet Explorer überhaupt nicht unterstützt, Chrome vor Version 47, Firefox vor Version 43, Safari vor Version 9 und Edge vor Version 14. Hier ist also Polyfill von Mozilla .
Entfernen mehrerer Elemente (möglicherweise in Zukunft)
Wenn der Vorschlag "Diese verbindliche Syntax" jemals akzeptiert wird, können Sie Folgendes tun:
Probieren Sie es selbst in BabelJS :)
Referenz
quelle
filter
muss für ein großes Array allerdings viel langsamer sein?filter
Möglicherweise ist die Leistung langsamer, aber der Code ist sicherer und besser. Sie können auch nach Index filtern, indem Sie ein zweites Argument im Lambda angeben:arr.filter((x,i)=>i!==2)
Es hängt davon ab, ob Sie einen leeren Platz behalten möchten oder nicht.
Wenn Sie einen leeren Steckplatz möchten, ist Löschen in Ordnung:
Wenn Sie dies nicht tun, sollten Sie die Spleißmethode verwenden:
Und wenn Sie den Wert dieses Elements benötigen, können Sie einfach das Element des zurückgegebenen Arrays speichern:
Falls Sie dies in einer bestimmten Reihenfolge tun möchten, können Sie es
array.pop()
für die letzte oderarray.shift()
für die erste verwenden (und beide geben auch den Wert des Elements zurück).Und wenn Sie den Index des Artikels nicht kennen, können Sie ihn verwenden
array.indexOf(item)
, um ihn zu erhalten (in aif()
, um einen Artikel zu erhalten, oder in awhile()
, um alle zu erhalten).array.indexOf(item)
Gibt entweder den Index oder -1 zurück, wenn er nicht gefunden wird.quelle
delete
ist nicht der richtige Weg, um ein Element aus einem Array zu entfernen !!array[index] = undefined;
. Die Verwendungdelete
zerstört die Optimierung.Ein Freund hatte Probleme mit Internet Explorer 8 und zeigte mir, was er tat. Ich sagte ihm, dass es falsch sei, und er sagte mir, dass er hier die Antwort bekommen habe. Die aktuelle Top-Antwort funktioniert nicht in allen Browsern (z. B. Internet Explorer 8) und entfernt nur das erste Vorkommen des Elements.
Entfernen Sie ALLE Instanzen aus einem Array
Es durchläuft das Array rückwärts (da sich Indizes und Länge ändern, wenn Elemente entfernt werden) und entfernt das Element, wenn es gefunden wird. Es funktioniert in allen Browsern.
quelle
i = arr.length -1
oderi--
mit dem maximalen Index beginnt .arr.length
ist nur ein Anfangswert füri
.i--
wird immer wahr sein (und bei jeder Schleifenoperation um 1 reduzieren), bis es gleich ist0
(ein falscher Wert) und die Schleife dann stoppt.arr.filter(function (el) { return el !== item })
, die Notwendigkeit vermieden wird, die Anordnung mehrfach zu mutieren. Dies verbraucht etwas mehr Speicher, arbeitet aber viel effizienter, da weniger Arbeit erledigt werden muss.Es gibt zwei Hauptansätze:
Spleiß () :
anArray.splice(index, 1);
löschen :
delete anArray[index];
Seien Sie vorsichtig, wenn Sie delete für ein Array verwenden. Es ist gut zum Löschen von Attributen von Objekten, aber nicht so gut für Arrays. Es ist besser,
splice
für Arrays zu verwenden.Denken Sie daran, wenn Sie verwenden
delete
für ein Array möglicherweise falsche Ergebnisse erzielt werdenanArray.length
. Mit anderen Worten,delete
würde das Element entfernen, aber den Wert der Eigenschaft length nicht aktualisieren.Sie können auch erwarten, dass nach der Verwendung von delete Lücken in den Indexnummern vorhanden sind, z. B. könnten Sie die Indizes 1, 3, 4, 8, 9 und 11 und die Länge wie vor der Verwendung von delete haben. In diesem Fall sind alle indiziert
for
Schleifen abstürzen, da die Indizes nicht mehr sequentiell sind.Wenn Sie
delete
aus irgendeinem Grund zur Verwendung gezwungen sind , sollten Siefor each
Schleifen verwenden, wenn Sie Arrays durchlaufen müssen. Vermeiden Sie nachfor
Möglichkeit immer die Verwendung von indizierten Schleifen. Auf diese Weise wäre der Code robuster und weniger anfällig für Probleme mit Indizes.quelle
quelle
for in
ein Array ausführen, haben Sie bereits ein Problem.for in
auf Arrays arbeiten, haben Sie bereits größere Probleme.Es besteht keine Notwendigkeit,
indexOf
oder zu verwendensplice
. Es funktioniert jedoch besser, wenn Sie nur ein Vorkommen eines Elements entfernen möchten.Finden und bewegen (bewegen):
Verwendung
indexOf
undsplice
(indexof):Nur verwenden
splice
(Spleiß):Laufzeiten auf NodeJS für ein Array mit 1000 Elementen (durchschnittlich über 10000 Läufe):
indexof ist ungefähr 10x langsamer als move . Selbst wenn es durch Entfernen des Aufrufs von
indexOf
in splice verbessert wird, ist die Leistung viel schlechter als das Verschieben .quelle
Dies liefert ein Prädikat anstelle eines Wertes.
HINWEIS: Das angegebene Array wird aktualisiert und die betroffenen Zeilen werden zurückgegeben.
Verwendungszweck
Definition
quelle
Sie können dies einfach mit der Filtermethode tun :
Dies entfernt alle Elemente aus dem Array und arbeitet auch schneller als eine Kombination von
slice
undindexOf
.quelle
John Resig hat eine gute Implementierung gepostet :
Wenn Sie ein globales Objekt nicht erweitern möchten, können Sie stattdessen Folgendes tun:
Der Hauptgrund, warum ich dies veröffentliche, besteht darin, Benutzer vor der alternativen Implementierung zu warnen, die in den Kommentaren auf dieser Seite (14. Dezember 2007) vorgeschlagen wurde:
Zunächst scheint es gut zu funktionieren, aber durch einen schmerzhaften Prozess habe ich festgestellt, dass es fehlschlägt, wenn versucht wird, das vorletzte Element in einem Array zu entfernen. Wenn Sie beispielsweise ein Array mit 10 Elementen haben und versuchen, das 9. Element damit zu entfernen:
Sie erhalten ein Array mit 8 Elementen. Ich weiß nicht warum, aber ich habe bestätigt, dass Johns ursprüngliche Implementierung dieses Problem nicht hat.
quelle
Object.prototype.hasOwnProperty
Tour gelernt, warum es eine gute Idee ist, immer ¬¬ zu verwendenMit Underscore.js können Probleme mit mehreren Browsern gelöst werden. Falls vorhanden, werden eingebaute Browsermethoden verwendet. Wenn sie nicht vorhanden sind, wie bei älteren Internet Explorer-Versionen, werden eigene benutzerdefinierte Methoden verwendet.
Ein einfaches Beispiel zum Entfernen von Elementen aus dem Array (von der Website):
quelle
Sie können ES6 verwenden. Zum Beispiel, um den Wert '3' in diesem Fall zu löschen:
Ausgabe :
quelle
Wenn Sie ein neues Array mit entfernten gelöschten Positionen wünschen, können Sie jederzeit das bestimmte Element löschen und das Array herausfiltern. Für Browser, die die Filtermethode nicht implementieren, ist möglicherweise eine Erweiterung des Array-Objekts erforderlich. Auf lange Sicht ist dies jedoch einfacher, da Sie lediglich Folgendes tun:
Es sollte angezeigt werden
[1, 2, 3, 4, 6]
.quelle
Überprüfen Sie diesen Code. Es funktioniert in jedem gängigen Browser .
Rufen Sie diese Funktion auf
quelle
for in
-loop und der Tatsache, dass das Skript früher gestoppt werden konnte, indem das Ergebnis direkt aus der Schleife zurückgegeben wurde. Die Upvotes sind angemessen;)for( i = 0; i < arr.length; i++ )
der ein besserer Ansatz wäre, da er die genauen Indizes gegenüber der Reihenfolge beibehält, in der der Browser die Elemente (mitfor in
) speichert . Auf diese Weise können Sie auch den Array-Index eines Werts abrufen, wenn Sie ihn benötigen.Sie können lodash _.pull (mutiertes Array), _.pullAt (mutiertes Array) oder _.without (mutiertes Array nicht) verwenden.
quelle
ES6 & ohne Mutation: (Oktober 2016)
quelle
filter
dann verwenden?array.filter((_, index) => index !== removedIndex);
.Das Entfernen eines bestimmten Elements / Strings aus einem Array kann in einem Einzeiler erfolgen:
wo:
theArray : Das Array, aus dem Sie etwas Bestimmtes entfernen möchten
stringToRemoveFromArray : Die Zeichenfolge, die entfernt werden soll, und 1 ist die Anzahl der Elemente, die Sie entfernen möchten.
HINWEIS : Wenn sich "stringToRemoveFromArray" nicht in Ihrem Array befindet, wird das letzte Element des Arrays entfernt.
Es ist immer empfehlenswert, zuerst zu überprüfen, ob das Element in Ihrem Array vorhanden ist, bevor Sie es entfernen.
Wenn Sie auf den Computern Ihres Clients Zugriff auf neuere Ecmascript-Versionen haben (WARNUNG, funktioniert möglicherweise nicht auf älteren Stationen):
Wobei '3' der Wert ist, den Sie aus dem Array entfernen möchten. Das Array würde dann werden:
['1','2','4','5','6']
quelle
"stringToRemoveFromArray"
das letzte Element des Arrays entfernt wird , wenn es sich nicht in Ihrem Array befindet.Hier sind einige Möglichkeiten, um ein Element mithilfe von JavaScript aus einem Array zu entfernen .
Alle beschriebenen Methoden mutieren nicht das ursprüngliche Array , sondern erstellen stattdessen ein neues.
Wenn Sie den Index eines Elements kennen
Angenommen, Sie haben ein Array und möchten ein Element an seiner Position entfernen
i
.Eine Methode ist zu verwenden
slice()
:slice()
Erstellt ein neues Array mit den empfangenen Indizes. Wir erstellen einfach ein neues Array vom Anfang bis zum Index, den wir entfernen möchten, und verketten ein anderes Array von der ersten Position nach der Position, die wir entfernt haben, bis zum Ende des Arrays.Wenn Sie den Wert kennen
In diesem Fall ist die Verwendung eine gute Option
filter()
, die einen deklarativeren Ansatz bietet :Dies verwendet die ES6-Pfeilfunktionen. Sie können die herkömmlichen Funktionen verwenden, um ältere Browser zu unterstützen:
Oder Sie können Babel verwenden und den ES6-Code zurück in ES5 transpilieren, um ihn für alte Browser besser verdaulich zu machen, und dennoch modernes JavaScript in Ihren Code schreiben.
Mehrere Elemente entfernen
Was ist, wenn Sie anstelle eines einzelnen Elements viele Elemente entfernen möchten?
Lassen Sie uns die einfachste Lösung finden.
Nach Index
Sie können einfach eine Funktion erstellen und Elemente in Serie entfernen:
Nach Wert
Sie können nach der Aufnahme in die Rückruffunktion suchen:
Vermeiden Sie die Mutation des ursprünglichen Arrays
splice()
(nicht zu verwechseln mitslice()
) mutiert das ursprüngliche Array und sollte vermieden werden.(ursprünglich veröffentlicht unter https://flaviocopes.com/how-to-remove-item-from-array/ )
quelle
OK, zum Beispiel haben Sie das folgende Array:
Und wir möchten Nummer 4 löschen. Sie können einfach den folgenden Code verwenden:
Wenn Sie diese Funktion wiederverwenden, schreiben Sie eine wiederverwendbare Funktion, die wie folgt an die native Array-Funktion angehängt wird:
Aber wie wäre es, wenn Sie stattdessen das folgende Array mit ein paar [5] s im Array haben?
Wir brauchen eine Schleife, um sie alle zu überprüfen, aber eine einfachere und effizientere Möglichkeit ist die Verwendung integrierter JavaScript-Funktionen. Deshalb schreiben wir eine Funktion, die stattdessen einen Filter wie den folgenden verwendet:
Es gibt auch Bibliotheken von Drittanbietern, die Ihnen dabei helfen, wie Lodash oder Underscore. Weitere Informationen finden Sie unter lodash _.pull, _.pullAt oder _.without.
quelle
this.splice(num.indexOf(x), 1);
=>this.splice(this.indexOf(x), 1);
Ich bin ziemlich neu in JavaScript und brauchte diese Funktionalität. Ich habe nur folgendes geschrieben:
Dann, wenn ich es benutzen möchte:
Ausgabe - Wie erwartet. ["item1", "item1"]
Möglicherweise haben Sie andere Anforderungen als ich, sodass Sie sie problemlos an sie anpassen können. Ich hoffe das hilft jemandem.
quelle
Wenn Sie komplexe Objekte im Array haben, können Sie Filter verwenden? In Situationen, in denen $ .inArray oder array.splice nicht so einfach zu verwenden sind. Besonders wenn die Objekte im Array vielleicht flach sind.
Beispiel: Wenn Sie ein Objekt mit einem ID-Feld haben und möchten, dass das Objekt aus einem Array entfernt wird:
quelle
Ich möchte basierend auf ECMAScript 6 antworten . Angenommen, Sie haben ein Array wie das folgende:
Wenn Sie an einem speziellen Index wie löschen möchten
2
, schreiben Sie den folgenden Code:Wenn Sie jedoch ein spezielles Element wie löschen möchten
3
und dessen Index Sie nicht kennen, gehen Sie wie folgt vor:Hinweis : Bitte verwenden Sie eine Pfeilfunktion für den Filterrückruf, es sei denn, Sie erhalten ein leeres Array.
quelle
Update: Diese Methode wird nur empfohlen, wenn Sie ECMAScript 2015 (früher bekannt als ES6) nicht verwenden können. Wenn Sie es verwenden können, bieten andere Antworten hier viel übersichtlichere Implementierungen.
Dieser Kern hier löst Ihr Problem und löscht auch alle Vorkommen des Arguments anstelle von nur 1 (oder einem angegebenen Wert).
Verwendungszweck:
quelle
Performance
Heute (09.12.2019) führe ich Leistungstests unter macOS 10.13.6 (High Sierra) für ausgewählte Lösungen durch. ich zeige
delete
(A), aber ich benutze es nicht im Vergleich zu anderen Methoden, weil es leeren Raum im Array gelassen hat.Die Schlussfolgerungen
array.splice
(C) (außer Safari für kleine Arrays, bei denen es das zweite Mal gibt).array.slice+splice
(H) die schnellste unveränderliche Lösung für Firefox und Safari.Array.from
(B) ist in Chrome am schnellstenEinzelheiten
In Tests entferne ich das mittlere Element auf verschiedene Weise aus dem Array. Die A, C- Lösungen sind vorhanden. Die Lösungen B, D, E, F, G, H sind unveränderlich.
Ergebnisse für Array mit 10 Elementen
In Chrome ist
array.splice
(C) die schnellste In-Place-Lösung. Dasarray.filter
(D) ist die schnellste unveränderliche Lösung. Das langsamste istarray.slice
(F). Sie können den Test auf Ihrem Rechner ausführen hier .Ergebnisse für Array mit 1.000.000 Elementen
In Chrome ist
array.splice
(C) die schnellste In-Place-Lösung (delete
(C) ist ähnlich schnell - es wurde jedoch ein leerer Steckplatz im Array belassen (sodass keine vollständige Entfernung durchgeführt wird)). Dasarray.slice-splice
(H) ist die schnellste unveränderliche Lösung. Das langsamste istarray.filter
(D und E). Sie können den Test auf Ihrem Rechner ausführen hier .Code-Snippet anzeigen
Vergleich für Browser: Chrome v78.0.0, Safari v13.0.4 und Firefox v71.0.0
quelle
Sie sollten Ihr Array niemals mutieren. Da dies gegen das funktionale Programmiermuster ist. Sie können ein neues Array erstellen, ohne auf das Array zu verweisen, dessen Daten Sie mithilfe der ECMAScript 6-Methode ändern möchten
filter
.Angenommen, Sie möchten
5
aus dem Array entfernen , können Sie dies einfach folgendermaßen tun:Dadurch erhalten Sie ein neues Array ohne den Wert, den Sie entfernen möchten. Das Ergebnis wird also sein:
Zum weiteren Verständnis können Sie die MDN-Dokumentation zu Array.filter lesen .
quelle
Ein modernerer ECMAScript 2015- Ansatz (früher bekannt als Harmony oder ES 6). Gegeben:
Dann:
Nachgeben:
Sie können Babel und einen Polyfill-Dienst verwenden, um sicherzustellen, dass dies in allen Browsern gut unterstützt wird.
quelle
.filter
ein neues Array zurückgegeben wird, was nicht genau dem Entfernen des Elements aus demselben Array entspricht. Der Vorteil dieses Ansatzes besteht darin, dass Sie Array-Methoden miteinander verketten können. zB:[1,2,3].filter(n => n%2).map(n => n*n) === [ 1, 9 ]
splice
oder verwendenslice
.items= items.filter(x=>x!=3)
. Außerdem gab das OP keine Anforderung für große Datenmengen an.Sie haben 1 bis 9 im Array und möchten 5 entfernen. Verwenden Sie den folgenden Code:
Wenn Sie mehrere Werte verwenden möchten. Beispiel: - 1,7,8
Wenn Sie einen Array-Wert in einem Array entfernen möchten. Beispiel: [3,4,5]
Enthält unterstützten Browser ist Link .
quelle
Ich weiß, dass es bereits viele Antworten gibt, aber viele davon scheinen das Problem zu komplizieren. Hier ist eine einfache, rekursive Methode zum Entfernen aller Instanzen eines Schlüssels - ruft self auf, bis der Index nicht gefunden wird. Ja, es funktioniert nur in Browsern mit
indexOf
, aber es ist einfach und kann leicht polygefüllt werden.Standalone-Funktion
Prototyp-Methode
quelle
Sie können eine Rückwärtsschleife ausführen, um sicherzustellen, dass die Indizes nicht durcheinander gebracht werden, wenn mehrere Instanzen des Elements vorhanden sind.
Live-Demo
quelle