wake-up-neo.com

Array-Elemente in JavaScript löschen - Delete vs Splice

Was ist der Unterschied zwischen der Verwendung von der Variable delete für das Array-Element und nicht der Verwendung von der Methode Array.splice

Zum Beispiel:

myArray = ['a', 'b', 'c', 'd'];

delete myArray[1];
//  or
myArray.splice (1, 1);

Warum sogar die Splice-Methode, wenn ich Array-Elemente löschen kann, wie ich es mit Objekten tun kann?

1245
lYriCAlsSH

delete löscht die Objekteigenschaft, indiziert das Array jedoch nicht neu und aktualisiert seine Länge nicht. Dadurch erscheint es so, als sei es undefiniert:

> myArray = ['a', 'b', 'c', 'd']
  ["a", "b", "c", "d"]
> delete myArray[0]
  true
> myArray[0]
  undefined

Beachten Sie, dass es nicht tatsächlich auf den Wert undefined gesetzt ist, sondern dass die Eigenschaft aus dem Array entfernt wird, wodurch scheint undefined. Mit den Chrome-Entwicklertools wird diese Unterscheidung deutlich, indem beim Protokollieren des Arrays empty gedruckt wird.

> myArray[0]
  undefined
> myArray
  [empty, "b", "c", "d"]

myArray.splice(start, deleteCount) entfernt tatsächlich das Element, indexiert das Array neu und ändert seine Länge.

> myArray = ['a', 'b', 'c', 'd']
  ["a", "b", "c", "d"]
> myArray.splice(0, 2)
  ["a", "b"]
> myArray
  ["c", "d"]
1622
Andy Hume

Array.remove () -Methode

John Resig, der Entwickler von jQuery, hat eine sehr praktische Array.remove-Methode erstellt, die ich in meinen Projekten immer benutze.

// Array Remove - By John Resig (MIT Licensed)
Array.prototype.remove = function(from, to) {
  var rest = this.slice((to || from) + 1 || this.length);
  this.length = from < 0 ? this.length + from : from;
  return this.Push.apply(this, rest);
};

und hier einige Beispiele, wie es verwendet werden könnte:

// Remove the second item from the array
array.remove(1);
// Remove the second-to-last item from the array
array.remove(-2);
// Remove the second and third items from the array
array.remove(1,2);
// Remove the last and second-to-last items from the array
array.remove(-2,-1);

Johns Website

330
Mohsen

Da das Objekt nur durch Löschen aus dem Element im Array entfernt wird, ändert sich die Länge des Arrays nicht. Splice entfernt das Objekt und verkürzt das Array.

Der folgende Code zeigt "a", "b", "undefined", "d" an.

myArray = ['a', 'b', 'c', 'd']; delete myArray[2];

for (var count = 0; count < myArray.length; count++) {
    alert(myArray[count]);
}

Während dies angezeigt wird "a", "b", "d"

myArray = ['a', 'b', 'c', 'd']; myArray.splice(2,1);

for (var count = 0; count < myArray.length; count++) {
    alert(myArray[count]);
}
99
andynormancx

Ich stolperte über diese Frage und versuchte zu verstehen, wie jedes Vorkommen eines Elements aus einem Array entfernt wird. Hier ist ein Vergleich von splice und delete zum Entfernen jedes 'c' aus dem items-Array.

var items = ['a', 'b', 'c', 'd', 'a', 'b', 'c', 'd'];

while (items.indexOf('c') !== -1) {
  items.splice(items.indexOf('c'), 1);
}

console.log(items); // ["a", "b", "d", "a", "b", "d"]

items = ['a', 'b', 'c', 'd', 'a', 'b', 'c', 'd'];

while (items.indexOf('c') !== -1) {
  delete items[items.indexOf('c')];
}

console.log(items); // ["a", "b", undefined, "d", "a", "b", undefined, "d"]
​
63
Troy Harvey

Aus Core JavaScript 1.5 Referenz> Operatoren> Spezialoperatoren> Operator löschen :

Wenn Sie ein Array-Element löschen, wird der Die Arraylänge ist nicht betroffen. Zum Wenn Sie beispielsweise eine [3] löschen, ist eine [4] noch ist ein [4] und ein [3] undefiniert. Diese gilt auch wenn Sie das letzte löschen Element des Arrays (löschen a [a.length-1]).

14
f3lix

Es ist wahrscheinlich auch erwähnenswert, dass der Spleiß nur für Arrays funktioniert. (Objekteigenschaften können nicht für eine konsistente Reihenfolge verwendet werden.)

Um das Schlüssel-Wert-Paar aus einem Objekt zu entfernen, ist Löschen genau das, was Sie möchten: 

delete myObj.propName;     // , or:
delete myObj["propName"];  // Equivalent.
9
jtrick

splice arbeitet mit numerischen Indizes.

delete kann gegen andere Arten von Indizes verwendet werden.

beispiel:

delete myArray['text1'];
9
Gopal

Wie bereits mehrfach erwähnt, scheint die Verwendung von splice() eine perfekte Passform zu sein. Dokumentation bei Mozilla:

Die Methode splice() ändert den Inhalt eines Arrays, indem vorhandene Elemente entfernt und/oder neue Elemente hinzugefügt werden.

var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

myFish.splice(2, 0, 'drum'); 
// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]

myFish.splice(2, 1); 
// myFish is ["angel", "clown", "mandarin", "sturgeon"]

Syntax

array.splice(start)
array.splice(start, deleteCount)
array.splice(start, deleteCount, item1, item2, ...)

Parameter

start

Index, an dem das Array geändert werden soll. Ist die Länge des Arrays größer, wird der tatsächliche Startindex auf die Länge des Arrays gesetzt. Wenn negativ, beginnen so viele Elemente vom Ende.

deleteCount

Eine Ganzzahl, die die Anzahl der zu entfernenden alten Arrayelemente angibt. Wenn deleteCount 0 ist, werden keine Elemente entfernt. In diesem Fall sollten Sie mindestens ein neues Element angeben. Wenn deleteCount größer ist als die Anzahl der Elemente, die noch zu Beginn im Array verbleiben, werden alle Elemente bis zum Ende des Arrays gelöscht.

Wenn deleteCount weggelassen wird, ist deleteCount gleich (arr.length - start)..

item1, item2, ...

Die Elemente, die dem Array hinzugefügt werden sollen, beginnend am Startindex. Wenn Sie keine Elemente angeben, entfernt splice() nur Elemente aus dem Array.

Rückgabewert

Ein Array mit den gelöschten Elementen. Wenn nur ein Element entfernt wird, wird ein Array mit einem Element zurückgegeben. Wenn keine Elemente entfernt werden, wird ein leeres Array zurückgegeben.

[...]

8
serv-inc

delete verhält sich wie eine Situation außerhalb der realen Welt, entfernt das Element, aber die Arraylänge bleibt gleich:

beispiel vom Knotenterminal:

> var arr = ["a","b","c","d"];
> delete arr[2]
true
> arr
[ 'a', 'b', , 'd', 'e' ]

Hier ist eine Funktion zum Entfernen eines Elements eines Arrays nach Index mit slice () . Es nimmt den Arr als erstes Argument und den Index des zu löschenden Members als zweites Argument. Wie Sie sehen, löscht es tatsächlich das Mitglied des Arrays und reduziert die Arraylänge um 1

function(arr,arrIndex){
    return arr.slice(0,arrIndex).concat(arr.slice(arrIndex + 1));
}

Die obige Funktion führt alle Mitglieder zum Index und alle Mitglieder nach dem Index, verkettet sie und gibt das Ergebnis zurück.

Hier ein Beispiel, in dem die Funktion oben als Knotenmodul verwendet wird, da das Terminal nützlich ist:

> var arr = ["a","b","c","d"]
> arr
[ 'a', 'b', 'c', 'd' ]
> arr.length
4 
> var arrayRemoveIndex = require("./lib/array_remove_index");
> var newArray = arrayRemoveIndex(arr,arr.indexOf('c'))
> newArray
[ 'a', 'b', 'd' ] // c ya later
> newArray.length
3

bitte beachten Sie, dass dies nicht für ein Array mit Dupes funktioniert, da indexOf ("c") nur das erste Vorkommnis erhält und nur das erste "c", das es findet, herausspleißen und entfernen.

7
med116

Vs Splice löschen

wenn Sie ein Element aus einem Array löschen

var arr = [1,2,3,4]; delete arr[2]; //result [1, 2, 3:, 4]
console.log(arr)

wenn du spleißst

var arr = [1,2,3,4]; arr.splice(1,1); //result [1, 3, 4]
console.log(arr);

im Falle von delete wird das Element gelöscht aber der Index bleibt leer

im Falle von splice wird das Element gelöscht und der Index der Restelemente wird entsprechend reduziert

7
ashish yadav

Wenn Sie ein großes Array iterieren und Elemente selektiv löschen möchten, ist der Aufruf von splice () für jeden Löschvorgang teuer, da splice () nachfolgende Elemente jedes Mal neu indizieren müsste. Da Arrays in Javascript assoziativ sind, ist es effizienter, die einzelnen Elemente zu löschen und das Array anschließend erneut zu indizieren. 

Sie können dies tun, indem Sie ein neues Array erstellen. z.B

function reindexArray( array )
{
       var result = [];
        for( var key in array )
                result.Push( array[key] );
        return result;
};

Ich denke jedoch nicht, dass Sie die Schlüsselwerte im ursprünglichen Array ändern können, was effizienter wäre - es sieht so aus, als müssten Sie ein neues Array erstellen.

Beachten Sie, dass Sie nicht nach "undefined" -Einträgen suchen müssen, da diese nicht vorhanden sind und die for-Schleife sie nicht zurückgibt. Es ist ein Artefakt des Array-Drucks, das sie als undefiniert anzeigt. Sie scheinen nicht im Gedächtnis zu existieren.

Es wäre schön, wenn Sie so etwas wie slice () verwenden könnten, was schneller wäre, aber es wird nicht neu indiziert. Kennt jemand einen besseren Weg?


Tatsächlich können Sie dies wahrscheinlich wie folgt tun, was wahrscheinlich leistungsfähiger ist:

reindexArray : function( array )
{
    var index = 0;                          // The index where the element should be
    for( var key in array )                 // Iterate the array
    {
        if( parseInt( key ) !== index )     // If the element is out of sequence
        {
            array[index] = array[key];      // Move it to the correct, earlier position in the array
            ++index;                        // Update the index
        }
    }

    array.splice( index );  // Remove any remaining elements (These will be duplicates of earlier items)
},
6
Mike T

sie können so etwas verwenden

var my_array = [1,2,3,4,5,6];
delete my_array[4];
console.log(my_array.filter(function(a){return typeof a !== 'undefined';})); // [1,2,3,4,6]

5
Zeeshan Saleem

Es sind verschiedene Dinge, die unterschiedliche Zwecke haben.

splice ist arrayspezifisch und entfernt beim Löschen Einträge aus dem Array und verschiebt alle vorherigen Einträge nach oben, um die Lücke zu füllen. (Es kann auch verwendet werden, um Einträge oder beides gleichzeitig einzufügen.) splice ändert die length des Arrays (vorausgesetzt, es ist kein No-Op-Aufruf: theArray.splice(x, 0)).

delete ist nicht feldspezifisch; Es ist für die Verwendung mit Objekten konzipiert: Es entfernt eine Eigenschaft (Schlüssel/Wert-Paar) aus dem Objekt, für das Sie es verwenden. Dies gilt nur für Arrays, da standardmäßige Arrays (z. B. nicht typisierte Arrays) in JavaScript überhaupt keine Arrays sind *. Sie sind Objekte mit speziellen Eigenschaften für bestimmte Eigenschaften, z "(welche sind definiert als Stringnamen" ..., deren numerischer Wert i im Bereich +0 ≤ i < 2^32-1 liegt) und length. Wenn Sie delete verwenden, um einen Array-Eintrag zu entfernen, müssen Sie lediglich den Eintrag entfernen. Andere Einträge werden nicht nach oben verschoben, um die Lücke zu füllen, und das Array wird "spärlich" (einige Einträge fehlen vollständig). Es hat keine Auswirkung auf length.

In einigen aktuellen Antworten auf diese Frage wird fälschlicherweise angegeben, dass mit delete "der Eintrag auf undefined gesetzt wird". Das stimmt nicht Es entfernt den Eintrag (Eigenschaft) vollständig, wodurch eine Lücke entsteht.

Verwenden wir etwas Code, um die Unterschiede zu veranschaulichen:

console.log("Using `splice`:");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
a.splice(0, 1);
console.log(a.length);            // 4
console.log(a[0]);                // "b"

console.log("Using `delete`");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
delete a[0];
console.log(a.length);            // still 5
console.log(a[0]);                // undefined
console.log("0" in a);            // false
console.log(a.hasOwnProperty(0)); // false

console.log("Setting to `undefined`");
var a = ["a", "b", "c", "d", "e"];
console.log(a.length);            // 5
a[0] = undefined;
console.log(a.length);            // still 5
console.log(a[0]);                // undefined
console.log("0" in a);            // true
console.log(a.hasOwnProperty(0)); // true


* (das ist ein Beitrag in meinem anämischen kleinen Blog)

2
T.J. Crowder
function remove_array_value(array, value) {
    var index = array.indexOf(value);
    if (index >= 0) {
        array.splice(index, 1);
        reindex_array(array);
    }
}
function reindex_array(array) {
   var result = [];
    for (var key in array) {
        result.Push(array[key]);
    }
    return result;
}

beispiel:

var example_arr = ['Apple', 'banana', 'lemon'];   // length = 3
remove_array_value(example_arr, 'banana');

banane wird gelöscht und Arraylänge = 2

2
Terry Lin

Derzeit gibt es zwei Möglichkeiten, dies zu tun

  1. mit splice ()

    arrayObject.splice(index, 1);

  2. mit löschen

    delete arrayObject[index];

Ich empfehle jedoch immer, Splice für Array-Objekte zu verwenden und für Objektattribute zu löschen, da beim Löschen die Array-Länge nicht aktualisiert wird.

Warum nicht einfach filtern? Ich denke, es ist der klarste Weg, die Arrays in js zu betrachten.

myArray = myArray.filter(function(item){
    return item.anProperty != whoShouldBeDeleted
});
2
Asqan

Der Unterschied kann durch Protokollieren der Länge jedes Arrays nach der Anwendung des delete-Operators und der splice()-Methode festgestellt werden. Zum Beispiel:

operator löschen

var trees = ['redwood', 'bay', 'cedar', 'Oak', 'maple'];
delete trees[3];

console.log(trees); // ["redwood", "bay", "cedar", empty, "maple"]
console.log(trees.length); // 5

Der delete-Operator entfernt das Element aus dem Array, der "Platzhalter" des Elements ist jedoch noch vorhanden. Oak wurde entfernt, benötigt jedoch noch Platz im Array. Aus diesem Grund bleibt die Länge des Arrays 5.

splice () - Methode

var trees = ['redwood', 'bay', 'cedar', 'Oak', 'maple'];
trees.splice(3,1);

console.log(trees); // ["redwood", "bay", "cedar", "maple"]
console.log(trees.length); // 4

Die splice()-Methode entfernt den Zielwert und den "Platzhalter" ebenfalls vollständig. Oak wurde entfernt, ebenso wie der Platz, den er im Array belegt hat. Die Länge des Arrays beträgt jetzt 4.

1
underthecode

OK, stellen Sie sich vor, wir haben dieses Array unten:

const arr = [1, 2, 3, 4, 5];

Lassen Sie uns zuerst löschen:

delete arr[1];

und das ist das Ergebnis:

[1, empty, 3, 4, 5];

leer! und lass es uns machen:

arr[1]; //undefined

Also bedeutet, dass nur der Wert gelöscht wird und er undefined jetzt ist, also die Länge gleich ist und auch true zurückgegeben wird.

Setzen wir unser Array zurück und machen es diesmal mit Spleiß:

arr.splice(1, 1);

und dies ist das Ergebnis dieses Mal:

[1, 3, 4, 5];

Wie Sie sehen, hat sich die Arraylänge geändert und arr[1] ist 3 now ...

Außerdem wird das gelöschte Element in einem Array zurückgegeben, das in diesem Fall [3] lautet ...

1
Alireza

delete : delete löscht die Objekteigenschaft, indiziert jedoch nicht das Array oder aktualisieren Sie seine Länge. Dadurch erscheint es so, als wäre es nicht definiert:

splice : Entfernt das Element tatsächlich, indexiert das Array neu und ändert seine Länge.

Element vom letzten löschen 

arrName.pop();

Element von Anfang an löschen 

arrName.shift();

Aus der Mitte löschen

arrName.splice(starting index,number of element you wnt to delete);

Ex: arrName.splice(1,1);

Löschen Sie ein Element vom letzten

arrName.splice(-1);

Löschen Sie mithilfe der Array-Indexnummer

 delete arrName[1];
0
Srikrushna Pal

Wenn sich das zu löschende Element in der Mitte befindet (beispielsweise "c", dessen Index 1 ist), können Sie Folgendes verwenden:

var arr = ['a','b','c'];
var indexToDelete = 1;
var newArray = arr.slice(0,indexToDelete).combine(arr.slice(indexToDelete+1, arr.length))
0
Idan Gozlan

IndexOf akzeptiert auch einen Referenztyp. Angenommen, das folgende Szenario:

var arr = [{item: 1}, {item: 2}, {item: 3}];
var found = find(2, 3); //pseudo code: will return [{item: 2}, {item:3}]
var l = found.length;

while(l--) {
   var index = arr.indexOf(found[l])
      arr.splice(index, 1);
   }
   
console.log(arr.length); //1

Anders:

var item2 = findUnique(2); //will return {item: 2}
var l = arr.length;
var found = false;
  while(!found && l--) {
  found = arr[l] === item2;
}

console.log(l, arr[l]);// l is index, arr[l] is the item you look for
0
roland

Für diejenigen, die Lodash verwenden möchten, können Sie Folgendes verwenden: myArray = _.without(myArray, itemToRemove)

Oder wie ich es in Angular2 verwende

import { without } from 'lodash';
...
myArray = without(myArray, itemToRemove);
...
0
Ricky Levi

Der einfachste Weg ist wahrscheinlich 

var myArray = ['a', 'b', 'c', 'd'];
delete myArray[1]; // ['a', undefined, 'c', 'd']. Then use lodash compact method to remove false, null, 0, "", undefined and NaN
myArray = _.compact(myArray); ['a', 'c', 'd'];

Hoffe das hilft. Referenz: https://lodash.com/docs#compact

0
Prashanth