ProgrammierungFrontend Entwickler

Erklären Sie den Unterschied zwischen der Deklaration von Variablen mit let, const und var in TypeScript. Wie beeinflusst die Wahl dieser Optionen den Geltungsbereich, die Möglichkeit der erneuten Deklaration, die Änderbarkeit des Wertes und den Schutz vor Fehlern? Geben Sie Beispiele für typische Anwendungsszenarien für jede Art der Deklaration.

Bestehen Sie Vorstellungsgespräche mit dem Hintsage-KI-Assistenten

Antwort.

In TypeScript (wie auch in modernem JavaScript) können Variablen mit let, const und var deklariert werden, und es gibt wichtige Unterschiede zwischen ihnen:

  • let — Block-sichtbare Gültigkeit, die Variable kann überschrieben werden (ein neuer Wert kann zugewiesen werden), aber kann nicht ein zweites Mal im selben Geltungsbereich deklariert werden.
  • const — Ebenfalls block-sichtbar, der Wert muss sofort zugewiesen werden, kann nicht überschrieben werden (aber die inneren Eigenschaften eines mit const deklarierten Objekts sind veränderbar!).
  • var — Funktionale Gültigkeit, gibt es Hoisting, die Variable kann neu deklariert und geändert werden.

Beispiel:

if (true) { let a = 10; const b = 20; var c = 30; } console.log(c); // 30 — außerhalb des Blocks sichtbar! console.log(a); // Fehler: a is not defined console.log(b); // Fehler: b is not defined

Typische Szenarien:

  • const — für Werte, die sich nicht ändern sollten (Konstanten, Einstellungen, Funktionsreferenzen).
  • let — für Werte, die sich während der Ausführung ändern (Zähler, Variablen in Schleifen).
  • var — wird nicht empfohlen, nur zur Unterstützung älterer Codes.

Fangfrage.

Kann const ein Objekt vollständig unveränderlich machen? Erklären Sie, geben Sie ein Beispiel.

Antwort: Nein, const verhindert nur die Änderung des Verweises selbst, schützt jedoch nicht vor Änderungen an den Eigenschaften eines Objekts!

const obj = { x: 1 }; obj.x = 2; // Das ist erlaubt! obj = { x: 3 }; // Fehler: Zuweisung eines neuen Verweises

Für volle Unveränderlichkeit verwendet man Object.freeze:

const frozen = Object.freeze({ x: 1 }); frozen.x = 2; // Fehler im strengen Modus, aber der Compiler warnt nicht immer!

Beispiele für reale Fehler aus Unkenntnis der Feinheiten des Themas.


Geschichte

Bei der Migration eines großen Frontend-Projekts zu TypeScript haben die Entwickler massenhaft var durch let ersetzt, ohne zu berücksichtigen, dass der Geltungsbereich nun block-sichtbar ist. Dies führte dazu, dass Zähler in einigen for-Schleifen außerhalb der Schleife nicht zugänglich waren, und unerwartete Fehler in der Logik auftraten: Der Code hörte auf zu funktionieren, wenn versucht wurde, auf den Schleifenzähler nach Abschluss der Schleife zuzugreifen.


Geschichte

Ein Entwickler erklärte eine Konstante über const zur Speicherung eines Konfigurationsobjekts und dachte, dass die Eigenschaften vor Änderungen geschützt wären. Später änderte ein anderer Teil des Programms zur Laufzeit eine Eigenschaft: dies führte zu schwer fassbaren Fehlern bei der Datenverarbeitung, da der externe Code "unerwartet" globale Einstellungen für alle Benutzer änderte.


Geschichte

Im Projekt wurden gleichzeitig let, const und var ohne klare Richtlinien verwendet. Eine Komponente deklarierte eine var-Variable innerhalb einer Funktion neu, während an anderer Stelle erwartet wurde, dass die Variable mit let deklariert wurde, sodass sie außerhalb des Blocks nicht sichtbar sein würde. Das Ergebnis: Überschneiden von Variablen, interne Logikfehler und schwieriges Debugging von Problemen mit unklarem Lebenszyklus der Variablen.