Beherrschung des Umfangs und des lexikalischen Umfangs in JavaScript

Geltungsbereich und lexikalischer Geltungsbereich in JavaScript

Das Verständnis des Bereichs und des lexikalischen Bereichs ist für das Schreiben von effizientem und fehlerfreiem JavaScript-Code von grundlegender Bedeutung. Diese Konzepte bestimmen, wie auf Variablen zugegriffen wird und wo sie in Ihrem Code verfügbar sind.

---

1. Geltungsbereich in JavaScript

Scope bezieht sich auf den aktuellen Ausführungskontext, der die Sichtbarkeit und Zugänglichkeit von Variablen bestimmt. JavaScript hat drei Arten von Bereichen:

A. Blockbereich

• Variablen, die mit let und const deklariert werden, sind blockbezogen, was bedeutet, dass sie nur innerhalb des Blocks zugänglich sind, in dem sie definiert sind.
• Eingeführt in ES6.

Beispiel:

{
  let a = 10;
  const b = 20;
  console.log(a, b); // Output: 10, 20
}
console.log(a); // Error: a is not defined

B. Funktionsumfang

• Mit var deklarierte Variablen sind funktionsbezogen. Sie sind innerhalb der gesamten Funktion, in der sie deklariert sind, zugänglich.
• Respektiert keine Blockgrenzen.

Beispiel:

function testFunctionScope() {
  if (true) {
    var x = 10; // Function-scoped
  }
  console.log(x); // Output: 10
}
testFunctionScope();

C. Globaler Geltungsbereich

• Variablen, die außerhalb einer Funktion oder eines Blocks deklariert werden, liegen im globalen Gültigkeitsbereich und sind überall im Programm zugänglich.

Beispiel:

var globalVar = "I am global";
console.log(globalVar); // Output: I am global

---

2. Lexikalischer Geltungsbereich

Lexikalischer Gültigkeitsbereich bedeutet, dass der Gültigkeitsbereich einer Variablen durch ihre Position im Quellcode bestimmt wird. Funktionen werden unter Verwendung der Bereichskette ausgeführt, die bei ihrer Definition vorhanden war, nicht bei ihrem Aufruf.

A. Scope-Kette

Die Bereichskette ist eine Hierarchie von Bereichen, die JavaScript zum Auflösen von Variablenverweisen verwendet. Wenn eine Variable im aktuellen Bereich nicht gefunden wird, sucht sie im äußeren Bereich und fährt fort, bis sie den globalen Bereich erreicht.

Beispiel:

function outer() {
  let outerVar = "I'm outer";

  function inner() {
    console.log(outerVar); // Accesses the outer scope
  }

  inner();
}
outer();
// Output: I'm outer

B. Verschachtelte Funktionen

Innere Funktionen haben aufgrund des lexikalischen Geltungsbereichs Zugriff auf Variablen in ihren äußeren Funktionen.

Beispiel:

function outerFunction() {
  let outerVariable = "Outer";

  function innerFunction() {
    let innerVariable = "Inner";
    console.log(outerVariable); // Outer
    console.log(innerVariable); // Inner
  }

  innerFunction();
}
outerFunction();

---

3. Praxisbeispiele

A. Zugriff auf äußere Scope-Variablen

function createMultiplier(multiplier) {
  return function (value) {
    return value * multiplier; // Accesses 'multiplier' from outer scope
  };
}

const double = createMultiplier(2);
console.log(double(5)); // Output: 10

B. Lexikalischer Geltungsbereich in Abschlüssen

Abschlüsse basieren auf dem lexikalischen Bereich, um sich Variablen aus ihrer äußeren Umgebung zu merken.

Beispiel:

function outerFunction() {
  let count = 0;
  return function () {
    count++;
    console.log(count);
  };
}

const counter = outerFunction();
counter(); // Output: 1
counter(); // Output: 2

---

4. Häufige Fehler mit Scope

A. Let und const vergessen

Variablen, die ohne let, const oder var deklariert wurden, werden zu globalen Variablen.

{
  let a = 10;
  const b = 20;
  console.log(a, b); // Output: 10, 20
}
console.log(a); // Error: a is not defined

B. Blockbereich mit var

Die Verwendung von var innerhalb eines Blocks führt zu unerwarteten Ergebnissen.

function testFunctionScope() {
  if (true) {
    var x = 10; // Function-scoped
  }
  console.log(x); // Output: 10
}
testFunctionScope();

C. Beschattung

Eine in einem verschachtelten Bereich deklarierte Variable kann eine Variable im äußeren Bereich überschatten (überschreiben).

var globalVar = "I am global";
console.log(globalVar); // Output: I am global

---

5. Unterschied zwischen Geltungsbereich und lexikalischem Geltungsbereich

Scope	Lexical Scope
Refers to the context in which variables are accessible.	Refers to how the location of variables in the code determines scope.
Can be global, block, or function.	Depends on the structure of the code when it is written.
Dynamic during runtime.	Fixed during code definition.

Geltungsbereich

---

Lexikalischer Geltungsbereich

Bezieht sich auf den Kontext, in dem auf Variablen zugegriffen werden kann. Bezieht sich darauf, wie die Position von Variablen im Code den Umfang bestimmt. Kann global, blockweise oder funktionell sein. Hängt von der Struktur des Codes beim Schreiben ab. Dynamisch zur Laufzeit. Während der Codedefinition behoben.

6. Best Practices

Verwenden Sie let und const

function outer() {
  let outerVar = "I'm outer";

  function inner() {
    console.log(outerVar); // Accesses the outer scope
  }

  inner();
}
outer();
// Output: I'm outer

: Verwenden Sie immer let und const, um unerwartete globale Variablen zu vermeiden.

1. 
   

   Globale Variablen minimieren
:
2. Globale Variablen können zu Namenskonflikten führen. Kapseln Sie Code in Funktionen oder Modulen.

   
   

   Lexikalischen Geltungsbereich verstehen
:

Nutzen Sie Abschlüsse und lexikalisches Scoping, um saubereren und effizienteren Code zu schreiben.

---

Zusammenfassung
• Bereich definiert, wo auf Variablen zugegriffen werden kann, mit drei Typen: global, Block und Funktion.
• Lexikalischer Geltungsbereich
stellt sicher, dass eine Funktion immer den Geltungsbereich verwendet, in dem sie definiert wurde.

Die Beherrschung dieser Konzepte ist für das Debuggen und Schreiben effektiven JavaScript-Codes von entscheidender Bedeutung.

Hallo, ich bin Abhay Singh Kathayat!

Ich bin ein Full-Stack-Entwickler mit Fachwissen sowohl in Front-End- als auch in Back-End-Technologien. Ich arbeite mit einer Vielzahl von Programmiersprachen und Frameworks, um effiziente, skalierbare und benutzerfreundliche Anwendungen zu erstellen. Sie können mich gerne unter meiner geschäftlichen E-Mail-Adresse erreichen: kaashshorts28@gmail.com.

Das obige ist der detaillierte Inhalt vonBeherrschung des Umfangs und des lexikalischen Umfangs in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!