Block-, Funktions- und Modul-Scope sowie die TDZ
Verstehen Sie Block-, Funktions- und Modul-Scope, erleben Sie die TDZ in Aktion und vermeiden Sie das Auslaufen von Variablen.
Block-, Funktions- und Modul-Scope sowie die TDZ ist eine kostenlose JavaScript Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 3. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des JavaScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.
Einführung
Ziel: Verstehen Sie, wo Variablen gültig sind und wann sie verwendet werden können.
- Block-Sichtbarkeit (let/const)
- Funktions-Sichtbarkeit (var)
- Modul-Sichtbarkeit
- TDZ-Sicherheit

Demo zur Block-Sichtbarkeit
Block-Sichtbarkeit hält Variablen auf den Bereich innerhalb eines geschweiften Klammerpaars beschränkt.
// Block scope: let/const exist only inside the braces
let lives = 3;
if (true) {
const bonus = 5;
let level = 1;
console.log("Inside block:", bonus, level);
}
console.log("Lives:", lives);
// Uncommenting next line would fail (not in scope):
// console.log(bonus, level);

Funktions-Sichtbarkeit mit var
var ist an Funktionen gebunden, nicht an Blöcke. Bevorzugen Sie in modernem JavaScript let und const.
// Function scope: var is visible across the whole function
function demo() {
if (true) {
var x = 10; // function-scoped
}
console.log("x is visible here:", x); // 10
}
demo();

Grundlagen der Modul-Sichtbarkeit
Modul-Sichtbarkeit: Bindungen auf der obersten Ebene sind auf die Datei beschränkt (ES-Module).
// Module scope: top-level variables are local to the module file
const appName = "CoddyKit";
console.log("App name:", appName);
// In a real project, this would be its own file/module.
// Other files must import to access appName.

Temporal Dead Zone
TDZ verhindert versehentliches Lesen vor der Deklaration. Deklarieren Sie Variablen zuerst und verwenden Sie sie danach.
// TDZ: using let/const before declaration throws ReferenceError
try {
// Uncommenting would trigger TDZ:
// console.log(mode); // ReferenceError
let mode = "dark";
console.log("Mode after declare:", mode);
} catch (e) {
console.log("Caught:", e.message);
}

Fallstricke bei der Sichtbarkeit
Fallstricke:
- Mischen Sie var nicht mit let/const im selben Gültigkeitsbereich.
- Deklarieren Sie Variablen nahe an ihrer Verwendung.
- Vermeiden Sie das Lesen von Werten vor der Deklarationszeile (TDZ).

TDZ-Quiz
Kurzer Check: Verhalten der TDZ.

Zusammenfassung
Zusammenfassung: let und const sind an Blöcke gebunden, var ist an Funktionen gebunden, Module haben ihren eigenen Gültigkeitsbereich auf Dateiebene und die TDZ verhindert zu frühen Zugriff.

Häufig gestellte Fragen
Ist die Lektion „Block-, Funktions- und Modul-Scope sowie die TDZ“ kostenlos?
Ja — der vollständige Text von „Block-, Funktions- und Modul-Scope sowie die TDZ“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des JavaScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der JavaScript Academy-Kurs umfasst insgesamt 3 Lektionen.
Was lerne ich in „Block-, Funktions- und Modul-Scope sowie die TDZ“?
Verstehen Sie Block-, Funktions- und Modul-Scope, erleben Sie die TDZ in Aktion und vermeiden Sie das Auslaufen von Variablen. Du übst JavaScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um JavaScript Academy zu starten?
Keine Vorkenntnisse erforderlich. JavaScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 3.
Wie lange dauert die Lektion „Block-, Funktions- und Modul-Scope sowie die TDZ“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser JavaScript Academy-Lektion Code schreiben und ausführen?
Ja. Jede JavaScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- let, const und var vermeiden
- Block-, Funktions- und Modul-Scope sowie die TDZ
- Benennung, Lesbarkeit und häufige Fallstricke