JavaScript-Arrays können Sie Werte gruppieren und über sie iterieren. Sie können Array-Elemente auf verschiedene Arten hinzufügen und entfernen. Leider gibt es kein einfaches Array.methode entfernen.
Wie löscht man ein Element aus einem JavaScript-Array?,
Anstelle einer Löschmethode bietet das JavaScript-Array verschiedene Möglichkeiten, Array-Werte zu bereinigen.
Sie können Elemente mit pop vom Ende eines Arrays, mit shift vom Anfang oder mit Splice von der Mitte entfernen. Die JavaScript-Array-Filtermethode zum Erstellen eines neuen Arrays mit den gewünschten Elementen ist eine erweiterte Methode zum Entfernen unerwünschter Elemente.,entfernen Sie Array – Elemente mit dem Löschoperator
Es gibt verschiedene Methoden und Techniken, mit denen Sie Elemente aus JavaScript – Arrays entfernen können:
- pop – Entfernt vom Ende eines Arrays
- shift-Entfernt vom Anfang eines Arrays
- splice-entfernt von einem bestimmten Array-Index
- Filter-ermöglicht das programmgesteuerte Entfernen aus einem Array
erfahren Sie auch einige andere Möglichkeiten, wie Sie Elemente aus einem Array entfernen können, die möglicherweise nicht so offensichtlich sind, wie bei LoDash.,
Elemente vom Ende eines JavaScript-Arrays entfernen
JavaScript-Array-Elemente können vom Ende eines Arrays entfernt werden, indem die Eigenschaft length auf einen Wert festgelegt wird, der unter dem aktuellen Wert liegt. Jedes Element, dessen Index größer oder gleich der neuen Länge ist, wird entfernt.
var ar = ; ar.length = 4; // set length to remove elements console.log( ar ); // Die pop-Methode entfernt das Letzte element des Arrays, gibt dieses element zurück, und aktualisiert die length-Eigenschaft. Die pop-Methode ändert das Array, auf dem es aufgerufen wird, Dies bedeutet, dass im Gegensatz zu delete das letzte Element vollständig entfernt und die Array-Länge reduziert wird.,
var ar = ; ar.pop(); // returns 6 console.log( ar ); // Elemente vom Anfang eines JavaScript-Arrays entfernen
Wie entferne ich das erste Element eines JavaScript-Arrays?
Die Shift-Methode funktioniert ähnlich wie die Pop-Methode, außer dass das erste Element eines JavaScript-Arrays anstelle des letzten entfernt wird.
Es gibt keine Parameter, da die Shift-Methode nur das erste Array-Element entfernt hat. Wenn das Element entfernt wird, werden die verbleibenden Elemente nach unten verschoben.,
var ar = ; ar.shift(); // returns "zero" console.log( ar ); // Die shift-Methode gibt das entfernte Element zurück, aktualisiert die Indizes der verbleibenden Elemente und aktualisiert die length-Eigenschaft. Es ändert das array, auf dem es aufgerufen wird.
Wenn keine Elemente vorhanden sind oder die Array-Länge 0 ist, gibt die Methode undefined zurück.
Verwenden von Splice zum Entfernen von Array-Elementen in JavaScript
Die Splice-Methode kann zum Hinzufügen oder Entfernen von Elementen aus einem Array verwendet werden. Das erste Argument gibt den Speicherort an, an dem mit dem Hinzufügen oder Entfernen von Elementen begonnen werden soll. Das zweite Argument gibt die Anzahl der zu entfernenden Elemente an., Das dritte und nachfolgende Argument sind optional; Sie geben Elemente an, die dem Array hinzugefügt werden sollen.
Hier verwenden wir die Splice-Methode, um zwei Elemente ab Position drei (nullbasierter Index) zu entfernen:
var arr = ; var removed = arr.splice(2,2); Ein Array mit den entfernten Elementen wird von der Splice-Methode zurückgegeben. Sie können sehen, dass das entfernte Array enthält und das ursprüngliche Array die verbleibenden Werte enthält.
Die Splice-Methode kann auch verwendet werden, um einen Bereich von Elementen aus einem Array zu entfernen.,
var list = ; list.splice(0, 2); // Starting at index position 0, remove two elements and retains .Entfernen von Array-Elementen nach Wert Mit Splice
Wenn Sie den Wert kennen, den Sie aus einem Array entfernen möchten, können Sie die Splice-Methode verwenden. Zuerst müssen Sie den Index des Zielelements identifizieren. Sie verwenden dann den Index als Startelement und entfernen nur ein Element.
var arr = ; for( var i = 0; i < arr.length; i++){ if ( arr === 5) { arr.splice(i, 1); } } //=> Dies ist ein einfaches Beispiel, bei dem die Elemente Ganzzahlen sind. Wenn Sie eine Reihe von Objekten haben, benötigen Sie eine ausgefeiltere Routine.
Dies funktioniert, wenn Sie nur ein einzelnes Element entfernen möchten., Wenn Sie mehrere Elemente entfernen möchten, die Ihren Kriterien entsprechen, gibt es einen Fehler.
Wenn die Elemente aus dem Array entfernt werden, wird der Index immer noch erhöht und das nächste Element nach dem Überspringen Ihres übereinstimmenden Werts.
Die einfache Lösung besteht darin, das obige Beispiel zu ändern, um die Indexvariable zu dekrementieren, damit das nächste Element im Array nicht übersprungen wird.
var arr = ; for( var i = 0; i < arr.length; i++){ if ( arr === 5) { arr.splice(i, 1); i--; } } //=> Im geänderten Beispiel habe ich dem Array 2 zusätzliche 5 Werte hinzugefügt. Ich habe auch ‚i–;‘ nach dem Splice-Aufruf hinzugefügt.
Wenn Sie nun die Schleife ausführen, wird jedes übereinstimmende Element entfernt.,
Vielen Dank an Kristian Sletten für den Hinweis auf das Problem mit dem Überspringen der Schleife des folgenden Elements.
Mit der Array-Filtermethode Entfernen Sie Elemente nach Wert
Im Gegensatz zur Splice-Methode erstellt filter ein neues Array. filter() mutiert nicht das Array, auf dem es aufgerufen wird, sondern gibt ein neues Array zurück.
filter() hat einen einzigen parameter eine callback-Methode. Der Rückruf wird ausgelöst, wenn die Filtermethode die Array-Elemente durchläuft. Es werden drei Werte an den Rückruf übergeben: der aktuelle Wert oder das aktuelle Element, der aktuelle Array-Index und das vollständige Array.,
Die Rückrufmethode sollte entweder true oder false zurückgeben. Es liegt in Ihrer Verantwortung, den Wert (Element) zu testen, um festzustellen, ob er Ihren Kriterien entspricht. Wenn dies der Fall ist, können Sie true zurückgeben. Elemente, die true zurückgeben, werden dem neuen, gefilterten Array hinzugefügt.
var array = ; var filtered = array.filter(function(value, index, arr){ return value > 5; }); //filtered => //array => Sie sollten beachten, dass ein neues Array mit übereinstimmenden Werten zurückgegeben wird. Das ursprüngliche Array bleibt unberührt. Ich finde das nützlich, weil ich oft eine ursprüngliche Datenquelle beibehalten möchte, aber Teilmengen basierend auf verschiedenen Logiksätzen abrufen möchte.,
Die Methode zum Entfernen des Lodash-Arrays
Manchmal sind Hilfsbibliotheken der beste Weg, komplexere Probleme zu lösen. Lodash bietet eine Vielzahl von Array-Manipulationsmethoden, von denen eine entfernt wird.
Die Methode Lodash remove funktioniert ähnlich wie die Array-Filtermethode, aber irgendwie umgekehrt. Es speichert nicht die ursprünglichen Array-Werte, sondern entfernt übereinstimmende Elemente. Es gibt die übereinstimmenden Elemente als neues Array zurück.
var array = ;var evens = _.remove(array, function(n) { return n % 2 === 0;});console.log(array);// => console.log(evens);// => Erstellen einer Remove-Methode
Wie ich bereits erwähnt habe, gibt es kein natives Array.methode entfernen., Die Lodash-Methode löst dieses Problem, aber Sie möchten möglicherweise nicht immer Lodash verwenden. Dies bedeutet nicht, dass Sie keine Utility-Methode erstellen können. John Resig gab uns ein Modell zu folgen, aber er erweiterte den Array-Prototyp, was eine schlechte Idee ist.
Stattdessen habe ich eine Array-Remove-Utility-Methode erstellt, die einer Helfer-oder Utility-Bibliothek hinzugefügt werden kann. Wie die Lodash remove Methode ist der erste Parameter das Zielarray. Es verwendet Array.filter, um Elemente zurückzugeben, die keinem Wert entsprechen.
Diese Methode ist einfach, sie nimmt einfache Werte wie Zahlen oder Zeichenfolgen an., Sie könnten diese Methode ändern, um eine Customcomparison-Methode zu verwenden, aber ich denke, es wäre einfacher, die Filtermethode einfach direkt zu verwenden.
Array-Elemente explizit mit dem Löschoperator entfernen
Sie können bestimmte Array-Elemente mit dem Löschoperator entfernen:
var ar = ; delete ar; // delete element with index 4 console.log( ar ); // alert( ar ); // 1,2,3,4,,6Die Verwendung des Löschoperators wirkt sich nicht auf die Längeneigenschaft aus. Es beeinflusst auch nicht die Indizes nachfolgender Elemente. Das Array wird spärlich, was eine ausgefallene Art ist zu sagen, dass das gelöschte Element nicht entfernt wird, sondern undefiniert wird. Vergleichen Sie die Verwendung von delete mit der unten beschriebenen Splice-Methode.,
Der Löschoperator dient zum Entfernen von Eigenschaften aus JavaScript-Objekten, bei denen Arrays Objekte sind.
Der Grund, warum das Element nicht wirklich aus dem Array entfernt wird, ist, dass es beim Löschoperator mehr darum geht, Speicher freizugeben, als ein Element zu löschen. Der Speicher wird freigegeben, wenn keine Verweise mehr auf den Wert vorhanden sind.
Löschen oder Zurücksetzen eines JavaScript-Arrays
Was ist, wenn Sie ein ganzes Array leeren und einfach alle Elemente ablegen möchten?
Es gibt einige Techniken, mit denen Sie ein leeres oder neues Array erstellen können.,
Die einfachste und schnellste Technik besteht darin, eine Array-Variable auf ein leeres Array zu setzen:
var ar = ;//do stuffar = ;//a new, empty array!Das Problem, das dadurch entstehen kann, besteht darin, dass Sie Verweise auf die Variable haben. Die Verweise auf diese Variable ändern sich nicht, sie enthalten weiterhin die Werte des ursprünglichen Arrays. Das kann natürlich zu einem Fehler führen.
Dies ist ein vereinfachtes Beispiel für dieses Szenario:
var arr1 = ;var arr2 = arr1; // Reference arr1 by another variable arr1 = ; console.log(arr2); // Output Ein einfacher Trick zum Löschen eines Arrays besteht darin, die Eigenschaft length auf 0 zu setzen.,
var ar = ;console.log(ar); // Output ar.length = 0;console.log(ar); // Output Eine andere, unnatürliche Technik besteht darin, die Splice-Methode zu verwenden und die Array-Länge als zweiten Parameter zu übergeben. Dadurch wird eine Kopie der ursprünglichen Elemente zurückgegeben, was für Ihr Szenario nützlich sein kann.
var ar = ;console.log(ar); // Output ar.splice(0, ar.length);console.log(ar); // Output Die letzten beiden Techniken erstellen kein neues Array, sondern ändern die Elemente des Arrays. Dies bedeutet, dass Referenzen auch aktualisiert werden sollten.
Es gibt einen anderen Weg, eine while Schleife zu verwenden. Es fühlt sich ein wenig seltsam für mich an, sieht aber gleichzeitig schick aus, so dass es einige Freunde beeindrucken kann!,
var ar = ;console.log(ar); // Output while (ar.length) { ar.pop(); }console.log(ar); // Output Ich würde kein JavaScript-Array löschen, aber es funktioniert und ist lesbar. Einige Leistungstests haben auch gezeigt, dass dies die schnellste Technik ist, also ist es vielleicht besser als ich ursprünglich dachte!
Zusammenfassung
Das Entfernen von JavaScript-Array-Elementen ist wichtig für die Verwaltung Ihrer Daten. Es ist keine einzige Methode zum Entfernen verfügbar, aber es gibt verschiedene Methoden und Techniken, mit denen Sie unerwünschte Array-Elemente bereinigen können.
Dieser Artikel hat diese Methoden überprüft und wie sie verwendet werden können., Sie haben auch gesehen, wie Sie eine Hilfsmethode erstellen, mit der das Entfernen von Elementen aus einem Array etwas einfacher und konsistenter wird.
Vielen Dank an Rob Sherwood für den Hinweis auf einige syntaktische Tippfehler!