JavaScript - das var-Schlüsselwort

Hallo, zukünftige JavaScript-Zauberer! Heute machen wir uns auf eine aufregende Reise in die Welt der Variablen in JavaScript, mit einem besonderen Fokus auf das var-Schlüsselwort. Als dein freundlicher Nachbarschafts-Computerlehrer bin ich hier, um dich durch dieses grundlegende Konzept zu führen, das als Baustein für deine Programmierabenteuer dienen wird. Also, hol dir deine virtuellen Zauberstäbe (Tastaturen) und tauchen wir ein!

Syntax

Lassen wir mit den Grundlagen beginnen. In JavaScript verwenden wir das var-Schlüsselwort, um Variablen zu deklarieren. Stell dir Variablen als magische Behälter vor, die verschiedene Arten von Informationen aufnehmen können. Hier ist, wie wir sie erstellen:

var magischeZahl = 42;
var zaubererName = "Merlin";
var istZauberer = true;

In diesen Beispielen haben wir drei Variablen erstellt:

1. magischeZahl enthält eine Zahl (42)
2. zaubererName enthält eine Zeichenkette ("Merlin")
3. istZauberer enthält einen booleschen Wert (true)

Denke daran, JavaScript ist wie ein hilfsbereiter Assistent - es braucht nicht, dass du den Typ der gespeicherten Daten angibst. Es herausfindet das von alleine!

JavaScript-Variablenbereiche

Nun, lassen wir uns über etwas Fortgeschritteneres unterhalten - Variablenbereiche. In der magischen Welt von JavaScript haben Variablen verschiedene Bereiche, in denen sie existieren, die als Bereiche bekannt sind.

Globaler Bereich

Wenn du eine Variable außerhalb einer Funktion deklarierst, wird sie zu einer globalen Variable. Das ist wie das Erklären von etwas in der Großen Halle von Hogwarts - jeder kann es hören!

var globalerZauberspruch = "Lumos";

function zauberSpruchWerfen() {
console.log(globalerZauberspruch); // Ausgabe: "Lumos"
}

zauberSpruchWerfen();
console.log(globalerZauberspruch); // Ausgabe: "Lumos"

Funktionsbereich

Variablen, die innerhalb einer Funktion deklariert werden, sind nur innerhalb dieser Funktion zugänglich. Das ist wie das Flüstern eines geheimen Zaubertricks - nur diejenigen in der Funktion können es hören.

function geheimerZauberspruchLernen() {
var geheimerZauberspruch = "Alohomora";
console.log(geheimerZauberspruch); // Ausgabe: "Alohomora"
}

geheimerZauberspruchLernen();
console.log(geheimerZauberspruch); // Fehler: geheimerZauberspruch ist nicht definiert

JavaScript-Variablenhoisting

Jetzt wird JavaScript ein bisschen tricky. Es hat dieses eigenartige Verhalten namens Hoisting. Stell dir vor, wenn vor einem Quidditch-Spiel alle Besen an die Oberseite des Feldes schweben würden. Das ist ein bisschen, wie JavaScript mit var-Deklarationen umgeht!

console.log(magischerZauberstab); // Ausgabe: undefined
var magischerZauberstab = "Elder Zauberstab";

JavaScript hebt die Deklaration (aber nicht die Initialisierung) nach oben. Es ist, als ob der Code so geschrieben worden wäre:

var magischerZauberstab;
console.log(magischerZauberstab); // Ausgabe: undefined
magischerZauberstab = "Elder Zauberstab";

Wiedererkennung von mit 'var' definierten Variablen

Im Gegensatz zu einigen strikteren Programmiersprachen ist JavaScript sehr nachsichtig, wenn es um die Wiedererkennung von Variablen mit var geht. Es ist wie das mehrfache Umbenennen deines Eulenpartners ohne всякие Probleme!

var Eule = "Hedwig";
console.log(Eule); // Ausgabe: "Hedwig"

var Eule = "Errol";
console.log(Eule); // Ausgabe: "Errol"

Deklaration mehrerer Variablen in einer Anweisung

Um Zeit zu sparen (und Handkrämpfe vom viel Schreiben zu verhindern), kannst du mehrere Variablen auf einmal deklarieren. Es ist wie das Aufzaubern mehrerer Zaubertricks mit einer einzigen Bewegung deines Zauberstabs!

var zaubertrick1 = "Expelliarmus",
zaubertrick2 = "Expecto Patronum",
zaubertrick3 = "Wingardium Leviosa";

Verwendung des 'var'-Schlüsselworts in Schleifen

Das var-Schlüsselwort ist besonders nützlich in Schleifen. Es ist wie ein magischer Zähler, der deine Zauber verfolgt:

for (var i = 1; i <= 3; i++) {
console.log("Zaubertrick " + i + " zaubern");
}
// Ausgabe:
// Zaubertrick 1 zaubern
// Zaubertrick 2 zaubern
// Zaubertrick 3 zaubern

Achte jedoch darauf! Die Schleifenvariable i wird auch nach dem Ende der Schleife bestehen bleiben, was nicht immer das gewünschte Verhalten ist.

Deklaration mit Dekonstruktion

Schließlich schauen wir uns eine fortgeschrittene Technik namens Dekonstruktion an. Es ist wie das Aufbrechen eines Koffers voller magischer Gegenstände auf einmal:

var [zaubertrick, zauberstab, zaubertrank] = ["Lumos", "Holly", "Felix Felicis"];
console.log(zaubertrick);  // Ausgabe: "Lumos"
console.log(zauberstab);   // Ausgabe: "Holly"
console.log(zaubertrank); // Ausgabe: "Felix Felicis"

Das ermöglicht dir, mehrere Variablen von einem Array in einer Codezeile zuzuweisen. quite magical, right?

Nun, lassen Sie uns alle Methoden, die wir gelernt haben, in einer praktischen Tabelle zusammenfassen:

Methode	Beschreibung	Beispiel
Grundlegende Deklaration	Deklaration einer einzelnen Variable	var magischeZahl = 42;
Globaler Bereich	Deklaration einer überall zugänglichen Variable	var globalerZauberspruch = "Lumos";
Funktionsbereich	Deklaration einer nur in einer Funktion zugänglichen Variable	function() { var geheimerZauberspruch = "Alohomora"; }
Hoisting	Variablen werden an die Oberseite ihres Bereichs bewegt	console.log(x); var x = 5;
Wiedererkennung	Mehrfache Deklaration derselben Variable	var Eule = "Hedwig"; var Eule = "Errol";
Mehrfache Deklaration	Deklaration mehrerer Variablen in einer Anweisung	var zaubertrick1 = "Expelliarmus", zaubertrick2 = "Expecto Patronum";
Schleifen-Deklaration	Verwendung von var in einer for-Schleife	for (var i = 0; i < 5; i++) { ... }
Dekonstruktion	Zuweisung mehrerer Variablen aus einem Array	var [zaubertrick, zauberstab] = ["Lumos", "Holly"];

Und das war's, junge Zauberer! Ihr habt gerade eure erste Lektion zum var-Schlüsselwort in JavaScript abgeschlossen. Denkt daran, wie das Beherrschen jeder magischen Fähigkeit, erfordert auch das Programmieren Übung. Also weiter codieren, weiter experimentieren und vor allem: weiter Spaß haben! Bis zu unserer nächsten Lektion, möge dein Code frei von Fehlern sein und deine Variablen immer ordnungsgemäß deklariert sein!

Credits: Image by storyset