JavaScript - das void Schlüsselwort: Ein Anfängerleitfaden

Hallo da drüben, zukünftige JavaScript-Zauberer! Heute begeben wir uns auf eine aufregende Reise in die Welt des void Schlüsselworts in JavaScript. Keine Sorge, wenn du vorher noch nie eine Zeile Code geschrieben hast – ich werde dein freundlicher Guide sein, und wir werden dieses Thema Schritt für Schritt erkunden. Also, nimm deine virtuelle Zauberstab (alias deine Tastatur) und tauchen wir ein!

Was ist das void Schlüsselwort?

Bevor wir uns den Details zuwenden, lassen Sie uns verstehen, was void eigentlich ist. In JavaScript ist void ein Operator, der einen Ausdruck evaluiert und dann undefined zurückgibt. Jetzt könntest du denken: "Warum auf der Welt sollte ich das tun?" Nun, meine neugierigen Freunde, es gibt seine Verwendungszwecke, und wir werden sie gleich entdecken!

Syntax

Die Syntax des void Schlüsselworts ist ziemlich einfach:

void expression

Hier kann expression jede gültige JavaScript-Ausdruck sein. Der void Operator wird diesen Ausdruck evaluieren, aber immer undefined zurückgeben.

Schauen wir uns ein einfaches Beispiel an:

console.log(void 0); // Ausgabe: undefined
console.log(void(0)); // Ausgabe: undefined
console.log(void "Hello"); // Ausgabe: undefined
console.log(void (2 + 3)); // Ausgabe: undefined

Wie du sehen kannst, egal welchen Ausdruck wir nach void setzen, er gibt immer undefined zurück. Es ist wie ein Zauberer, der alles in einen Hasen verwandeln kann – nur dass unser Zauberer alles in undefined verwandelt!

Bedeutung der Vorrangigkeit des void Schlüsselworts

Nun lassen wir uns über etwas Fortgeschritteneres unterhalten – die Vorrangigkeit des void Schlüsselworts. In JavaScript haben Operatoren unterschiedliche Vorrangstufen, die bestimmen, in welcher Reihenfolge sie ausgewertet werden.

Der void Operator hat eine sehr hohe Vorrangigkeit. Das bedeutet, er wird vor den meisten anderen Operatoren ausgewertet. Lassen wir uns ein Beispiel ansehen:

let x = 1;
console.log(void x === undefined); // Ausgabe: true
console.log(void (x = 5)); // Ausgabe: undefined
console.log(x); // Ausgabe: 5

In diesem Beispiel wird void x === undefined als (void x) === undefined ausgewertet, nicht als void (x === undefined). Der void Operator wird zuerst auf x angewendet und gibt undefined zurück, das dann mit undefined verglichen wird.

In der zweiten Zeile gibt der void Operator immer noch undefined zurück, auch wenn wir 5 zu x zuweisen. Die Zuweisung findet jedoch statt, wie wir in der dritten Zeile sehen können.

Was ist javascript:void(0)?

Vielleicht bist du auf javascript:void(0) in HTML gestoßen, insbesondere in href Attributen von Anchor-Tags. Lassen wir das Rätsel lösen!

<a href="javascript:void(0);" onclick="console.log('Geklickt!')">Klicke mich</a>

In diesem Beispiel wird javascript:void(0) verwendet, um die Standardaktion des Links zu verhindern (was normalerweise das Navigieren zu einer neuen Seite wäre). Das onclick Ereignis wird trotzdem ausgelöst, aber der Link führt keine andere Aktion aus.

Es ist wie deinem Hund zu sagen "bleib" bevor du einen Ball hochwerfst – der Hund sieht die Aktion, aber bewegt sich nicht!

Das void Schlüsselwort mit Funktionen

Das void Schlüsselwort kann auch mit Funktionen verwendet werden. Sehen wir uns ein Beispiel an:

function begrüßen() {
console.log("Hallo, Welt!");
}

console.log(greet()); // Ausgabe: Hallo, Welt! undefined
console.log(void greet()); // Ausgabe: Hallo, Welt! undefined

In beiden Fällen wird "Hallo, Welt!" in der Konsole ausgegeben. Allerdings gibt greet() implizit undefined zurück (da Funktionen in JavaScript standardmäßig undefined zurückgeben, wenn kein Rückgabewert指定iert ist), während void greet() explizit undefined zurückgibt.

Das void Schlüsselwort mit Sofort invoked Function Expressions (IIFE)

Last but not least, schauen wir uns an, wie void mit Sofort invoked Function Expressions (IIFE) verwendet werden kann. Eine IIFE ist eine Funktion, die so schnell wie möglich nach ihrer Definition ausgeführt wird.

void function() {
console.log("Ich bin eine IIFE!");
}();

// Ausgabe: Ich bin eine IIFE!

In diesem Fall wird void verwendet, um sicherzustellen, dass der Funktionsausdruck als Ausdruck und nicht als Deklaration behandelt wird. Es ist wie sich vor einer Party zu verkleiden – die Funktion wird ausgeführt, aber sie bleibt nicht danach übrig!

Zusammenfassung der void Schlüsselwort Methoden

Hier ist eine praktische Tabelle, die die verschiedenen Möglichkeiten zusammenfasst, wie wir das void Schlüsselwort verwenden können:

Methode	Beispiel	Beschreibung
Grundlegende Verwendung	void 0	Gibt undefined zurück
Mit Ausdrücken	void (2 + 3)	Evaluiert Ausdruck, gibt undefined zurück
In HTML	<a href="javascript:void(0);">	Verhindert Standardlinkaktion
Mit Funktionen	void greet()	Ruft Funktion auf, gibt undefined zurück
Mit IIFE	void function() {}();	Führt IIFE aus, gibt undefined zurück

Und da haben wir es, Leute! Wir haben die Welt des void durchquert, von seiner grundlegenden Syntax bis zu seinen fortgeschrittenen Anwendungen. Denke daran, wie jedes Werkzeug in der Programmierung hat void seine spezifischen Verwendungszwecke. Es mag nicht etwas sein, das du jeden Tag verwendest, aber das Verständnis davon wird dich zu einem umfassenderen JavaScript-Entwickler machen.

Weiter üben, bleib neugierig, und bevor du es weißt, wirst du JavaScript-Zauber wie ein Profi zaubern! Bis下次, fröhliches Coden!

Credits: Image by storyset