Javascript delete, in, new, this und void

Objekte, Array-Items, Eigenschaften von Objekten löschen Ein kleiner Stift mit Radiergummi löscht ein Element

delete löscht ein Objekt, die Eigenschaft eines Objekts oder das Element an einem Index aus einem Array, Javascript in fragt ab, ob eine bestimmte Eigenschaft eines Objekt exisitert.

delete, in, new, this, void und der Komma-Operator sind spezielle Javascript-Operatoren. Sie halten den Script-Code kurz und übersichtlich.

Neben den mathematischen Operatoren und den Vergleichsoperatoren gibt es in Javascript spezielle Operatoren.

delete-Operator

delete löscht ein Objekt, die Eigenschaft eines Objekts oder ein Element an einem bestimmten Index aus einem Array.

Was so einfach klingt, ist ein heißes Eisen. Darum begegnen wir dem delete-Operator in wenigen Scripten. Zuerst 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.

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

gallery.image2 = null;
delete gallery.image3; 

let elem; 
for (elem in gallery) {
    console.log (gallery[elem]);
}

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 eingeleitet wurden), nicht aber durch das Schlüsswlwort var bzw. let 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; 
let y   = 43; 
myObj   = { height: 100, width: 400 }
myObj.height = 640;   // erzeugt die Eigenschaft height

delete x;             //  true  (darf gelöscht werden, da implizit deklariert)
delete y;             //  false (darf nicht gelöscht werden, da mit let deklariert)
delete Math.PI;       //  false (vordefinierte Eigenschaften dürfen nicht gelöscht werden)
delete myObj.height;  //  true  (Benutzerdefinierte Eigenschaften dürfen gelöscht werden)
delete myObj;         //  true  (kann gelöscht werden, wenn implizit deklariert)

Array-Elemente mit delete löschen

Wenn ein Array-Element gelöscht wird, ist die Länge des Arrays davon nicht betroffen. Wird das Array-Element mit dem delete-Operator gelöscht, liegt das Element nicht länger im Array.

colors = new Array("red", "green", "blue", "yellow", "purple");
delete colors[3];
if (3 in colors) {
   // wird nicht ausgeführt
}

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

colors    = new Array("red", "green", "blue", "yellow", "purple");
colors[3] = undefined;
if (3 in colors) {
   // wird ausgeführt
}

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.

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

let x = [1,2];
1 in x; // true
3 in x; // false
0 in x; // true 

new-Operator

Der new-Operator erzeugt eine neue Instanz eines Objekts – entweder eines benutzerdefinierten Objekts oder von einem vordefinierten Objekt (Array, Boolean, Date, Function, Image, Number, Object, Option, RegExp oder String), das eine Konstruktor-Funktion hat.

let myObject = new Object ( );

Neben der Erzeugung von Objekten durch eine Konstruktor-Funktion können Objekte auch durch eine Objekt-Initialisierung erzeugt werden (was manchmal auch als die Erzeugung von Objekten mit literaler Notation bezeichnet wird). Letzteres ist konsistent mit der Terminologie von C++. (objectName = (eigenschaft_1: wert1, eigenschaft_2: wert2, ... eigenschaftn: wert_n))

new Object () wird in Javascript eigentlich gar nicht gebraucht, benutzt wird die literale (wörtliche) Schreibweise. Dasselbe gilt für new Array (). In Javascript funktionieren Arrays anders als in Java, so dass eine Syntax, die sich an Java anlehnt, eher verwirrend wäre.

Javascript this

Das Schlüsselwort this verweist auf das aktuelle Objekt – i.d.R. auf das aufrufende Objekt in einer Methode.

this[.propertyName]

this ist ein Segen für die Flexibilität und ein Quell von Trugschlüssen: Javascript this – das Objekt, das mich rief

void

Der voidOperator wird auf folgende Weisen benutzt:

1. void (ausdruck)
2. void ausdruck

Der void-Operator spezifiziert einen Ausdruck, der evaluiert wird, ohne einen Wert zurückzugeben. Die Klammern um den Ausdruck sind optional, gelten aber als guter Stil.

Komma-Operator

Der Komma-Operator entwickelt zwei Operanden und gibt den Wert des zweiten Operanden zurück. Der Operator wird bevorzugt in for-Anweisungen eingesetzt, wenn mehrere Variablen in einer Schleife verarbeitet werden.

for (let i=0, j=9; i<=9; i++, j--) {
   myVar = a[i][j] + wert;
}

Javascript with

Der with-Operator macht ein beliebiges Objekt zum »Scope«. Das soll Schreibarbeit sparen und den Zugriff auf Objekt-Elemente übersichtlicher gestalten.

Im modernen Javascript gilt with als unerwünscht – deprecated.

Objektbandwürmer wie

baba.bumbum.hamma.sumsum.niknak.elem1 = x;
baba.bumbum.hamma.sumsum.niknak.elem2 = y;

verkürzt die with-Anweisung zu

with (baba.bumbum.hamma.sumsum.niknak) {
   elem1 = x; 
   elem2 = y;
}

und schon sieht alles viel harmloser aus.

Falle: Javascript with

Leider verbirgt die friedliche Oberfläche, was hier tatsächlich angesprochen wird: baba.bumbum.hamma.sumsum.niknak.elem1 oder eine globale Variable elem1?

with agiert auch nicht wirklich auf dem Objekt. Wir können eine Variable ändern, aber keine Variable hinzufügen.

let gallery = {
	width: 600
}

with (gallery) {
	width = 800;
	height = 400; 
}

console.log ('gallery ' + 
              gallery.width + ' ' + 
              gallery.height + ' ' + 
              window.height );

erzeugt keine neue Variable im Objekt gallery, sondern eine neue Variable height im window-Objekt. Ups – dieser Fehler ist schwer auszumachen.

Wieder ein Grund für den Einsatz von "use strict";, denn dann wirft die Console einen Syntaxfehler aus:

SyntaxError: 'with' statements are not valid in strict mode.

Obendrein beeinträchtigt with die Performance. Bei größeren Operationen wird das Script deutlich schneller, wenn das with entfernt wird.

In dieser Hinsicht bewirkt eine Variable dieselbe Vereinfachung, sorgt aber gleichzeitig dafür, dass der Kontext auf jeden Fall korrekt und bekannt ist.

let myObj = baba.bumbum.hamma.sumsum.niknak;
myObj.elem1 = x;
myObj.elem2 = y; 

entlastet genauso von der Schreibarbeit wie die with-Anweisung, stellt aber gleichzeitig sicher, welches elem1 bzw. elem2 hier gemeint ist.

Javascript delete delete