Javascript delete

delete-Operator

Was so einfach klingt, ist ein heißes Eisen. Darum begegnen wir dem delete-Operator in wenigen Scripten. Noch einmal: Javascript delete gibt keine Speicher frei. Warum also sollte man etwas löschen?

Statt ein Objekt zu löschen, könnte man dem Objekt null zuweisen. Aber dann würden eine in-Abfrage oder eine for-in-Schleife das Objekt weiterhin erkennen und verarbeiten.

const gallery = {
	image1: "slide1",
	image2: "slide2",
	image3: "slide3"
};

gallery.image2 = null;
delete gallery.image3; 

for (const elem in gallery) {
	document.querySelector(".gallery").innerHTML += `${gallery[elem]} <br>`;
}

gibt zwei Elemente zurück: slide1 und null. delete erspart Schleifendurchläufe und die Abfrage auf null.

Der delete-Operator löscht implizit vereinbarte Variablen (die nicht durch das Schlüsselwort var oder let / const eingeleitet wurden), nicht aber durch die Schlüsswlwörter var bzw. let /const deklarierte Variablen.

DOM-Elemente werden besser durch removeChild oder remove (noch nicht IE11) gelöscht.

Gelöscht und undefined

Wenn die delete-Operation gelingt, wird die Eigenschaft oder das Element auf undefined gesetzt. delete gibt true zurück, wenn das Element gelöscht werden kann, false wenn nicht.

Der Ausdruck delete ist eine unglückliche Wahl – remove hätte den Sinn und Zweck des delete-Operators besser getroffen.

x       = 42; 
const y = 43; 
myObj   = { height: 100, width: 400 }
myObj.height = 640;

darf gelöscht werden, da implizit deklariert
delete x;             //  true

darf nicht gelöscht werden, da mit let/const deklariert
delete y;             //  false

vordefinierte Eigenschaften dürfen nicht gelöscht werden
delete Math.PI;       //  false 

Benutzerdefinierte Eigenschaften dürfen gelöscht werden
delete myObj.height;  //  true

kann gelöscht werden, wenn implizit deklariert
delete myObj;         //  true  

Array-Elemente mit delete löschen

Javascript Arrays sind Objekte, also können ihre Elemente mit delete gelöscht werden. Wird das Array-Element mit dem delete-Operator gelöscht, liegt das Element aber nicht länger im Array.

Wenn ein Array-Element gelöscht wird, ist die Länge des Arrays davon nicht betroffen.

const lecker = new Array("🍨", "🍩", "🍫", "🍰", "🍯");
delete lecker[3];
if (3 in lecker) {
	document.querySelector (".lecker").innerHTML = "Wird nicht ausgeführt";
} else {
	document.querySelector (".lecker").innerHTML += `Anzahl Elemente ${lecker.length} <br>`;
}

for (const item of lecker) {
	document.querySelector (".lecker").innerHTML += `${item}, `;
}

Wenn das Array-Element weiter existieren, aber keinen definierten Wert haben soll, wird undefined anstelle von delete benutzt.

const trees    = new Array("🌵", "🏝", "🌲", "🌳", "🏕");
trees[3] = undefined;
if (3 in trees) {
   console.log (trees[3]);
}
console.log (trees);

0 "🌵"
1 "🏝"
2 "🌲"
3 undefined
4 "🏕"

Javascript in-Operator

Der in-Operator gibt true zurück, wenn eine angegebene Eigenschaft eines Objekt exisitert.

property in objectName

wobei property ein String oder ein numerischer Ausdruck ist, der Name einer Eigenschaft oder der Index eines Arrays ist.

        //   0   1   2   3 4  5
const x = ["🍄","🍆","🍒", , ,"🍊"];
console.log (1 in x);  // true
console.log (4 in x);  // false
console.log (10 in x); // false

Was Javascript in nicht liefert: Ob ein Array einen Wert enthält oder nicht.

console.log ("🍒" in x); // false