Lädt...

Gültigkeitsbereich

Sie können Variablen deklarieren, Funktionen schreiben und Werte zurückgeben. Eine weitere Regel entscheidet, ob ein Name überhaupt erreichbar ist: der Gültigkeitsbereich (Scope). Er beantwortet: „Von hier aus — welche Namen darf ich nutzen?“

Was Scope bedeutet

Scope ist der Bereich Ihres Programms, in dem ein Name existiert. Außerhalb kann dieselbe Schreibweise unsichtbar sein — oder auf eine andere Bindung zeigen. Denken Sie an Räume: ein Zettel an der Küchenwand ist in der Küche klar; auf der Straße nicht automatisch.

Drei Alltagstypen

📊 Global, Funktion und Block

Art Wo der Name lebt Typische Werkzeuge Wo sichtbar?
global außerhalb jeder Funktion let / const / var auf oberster Ebene im gesamten Skript (gleiche Seite)
Funktion (lokal) im Funktionskörper Parameter und Lokale nur in dieser Funktion
Block in { } wie if oder Schleife let und const nur in diesem Block

Diese drei decken den meisten Anfänger-Code ab. Funktionslokale bleiben privat. Block-Bindungen mit let und const bleiben in den Klammern. Globale sind geteilt — nützlich für einen gemeinsamen Zähler, riskant wenn jeder Name global wird.

Ein globaler Name

javascript 
let city = "Tehran";
function showCity() {
console.log(city);
}
showCity();
console.log(city);

Globale Namen stehen außerhalb von Funktionen

city ist auf oberster Ebene deklariert, daher lesen es die Funktion und das spätere console.log. Ändern Sie die Zeichenkette einmal; jeder Leser sieht den neuen Wert. Globale nur, wenn mehrere Teile wirklich einen Wert teilen.

Ein lokaler Name in einer Funktion

javascript 
function greet() {
let message = "Hello";
console.log(message);
}
greet();
// console.log(message); // Error: message is not defined

Lokale bleiben in der Funktion

message existiert nur, während greet läuft. Außerhalb ist der Name nicht definiert. Parameter ebenso: lokal zur Funktion, die sie listet.

Block-Scope mit let

javascript 
if (true) {
let score = 10;
console.log(score);
}
// console.log(score); // Error: score is not defined

let und const respektieren Blöcke

In { } ist eine let- oder const-Bindung nur in diesem Block sichtbar. Nach der schließenden Klammer ist score weg. Älteres var ist funktionsbezogen und kann aus einem Block „leaken“. Bevorzugen Sie let und const, damit Blockkanten bedeuten, was sie zeigen.

Verschachtelter Code liest nach außen

javascript 
let title = "Shop";
function show() {
let label = "open";
console.log(title + " is " + label);
}
show();

Verschachtelung schaut nach außen

show liest äußeres title und eigenes label. Die Suche geht nach außen, bis sie trifft. Nicht nach innen: äußerer Code sieht keinen Namen, der nur in der Funktion geboren wurde.

Innerer Name überschattet äußeren

javascript 
let status = "ok";
function check() {
let status = "busy";
console.log(status);
}
check();
console.log(status);

Shadowing: innen gewinnt in der Funktion

In check verdeckt lokales status das äußere. Der Aufruf druckt busy. Danach ist äußeres status noch ok. Gleiche Schreibweise, zwei Bindungen — Scope entscheidet.

Einen Scope-Wert auf der Seite zeigen

Halten Sie ein globales Label, bauen Sie in einer Funktion eine Zeile, die es noch lesen kann, und schreiben Sie das Ergebnis in einen Absatz.

Seitendemo mit Scope

html 
<!DOCTYPE html>
<html>
<head>
<title>scope — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
let place = "Garden";
function line() {
let state = "open";
return place + " is " + state;
}
let box = document.getElementById("msg");
box.textContent = line();
</script>
</body>
</html>

Der Absatz zeigt Garden is open. place ist global; state lokal zu line. Die Funktion liest beide, gibt einen String zurück, die Seite zeigt ihn. Ändern Sie nur place, aktualisieren Sie, lesen Sie die neue Zeile. Als Nächstes: Closures — Funktionen, die äußere Namen nach dem äußeren Aufruf behalten.

Übungen

  1. Deklarieren Sie globales let app = "demo" und loggen Sie es aus einer kleinen Funktion und von außen.
  2. Setzen Sie let secret = 1 in eine Funktion; außen muss secret einen Fehler werfen.
  3. In if (true) { } deklarieren Sie let n = 5 und loggen; versuchen Sie danach erneut.
  4. Lesen Sie aus einer inneren Funktion ein äußeres let ohne neue Deklaration.
  5. Überschatten Sie äußeres let tag = "A" mit innerem let tag = "B" und loggen Sie beide Stellen.
  6. In der HTML-Demo nur den place-String ändern, aktualisieren, Absatz lesen.

Häufige Stolperfallen

  • Lokalen Namen außerhalb seiner Funktion nutzen — ReferenceError, kein stilles Leer
  • Erwarten, dass var im Block so privat bleibt wie let
  • Annehmen, äußerer Code sehe nur innen erzeugte Namen
  • Scope mit return verwechseln — Sichtbarkeit vs. Wert zurückgeben
  • Hier eine volle Closures-Lektion erwarten — das ist die nächste Seite

Kurzgefasst

  • Scope ist, wo ein Name sichtbar und nutzbar ist
  • Globale leben außerhalb von Funktionen und sind skriptweit geteilt
  • Lokale und Parameter bleiben in ihrer Funktion
  • let/const in { } sind block-scoped; besser als leakendes var
  • Verschachtelung darf nach außen lesen; außen sieht keine nur-inneren Namen
  • Eine innere Bindung gleichen Namens überschattet die äußere
  • Seitenupdates können Global und Lokal in einem zurückgegebenen String kombinieren
  • Als Nächstes: Closures — Funktionen, die äußere Namen erinnern

🧠 Testen Sie Ihr Wissen

Bereit zum Start

Testen Sie Ihr Wissen

Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen

❓
8
Fragen
🎯
70%
Zum Bestehen
♾️
∞
Zeit
🔄
∞
Versuche

📝 Anweisungen

  • Lesen Sie jede Frage sorgfältig
  • Wählen Sie die beste Antwort für jede Frage
  • Sie können das Quiz so oft wiederholen, wie Sie möchten
  • Ihr Fortschritt wird oben angezeigt
Thema 31 von 31
Javascript Tutorial