Globales Objekt

Das globale Objekt stellt Variablen und Funktionen bereit, die überall verfügbar sind. Standardmäßig diejenigen, die in die Sprache oder die Umgebung integriert sind.

In einem Browser heißt es window , für Node.js ist es global , für andere Umgebungen kann es einen anderen Namen haben.

Kürzlich wurde der Sprache globalThis als standardisierter Name für ein globales Objekt hinzugefügt, das in allen Umgebungen unterstützt werden sollte. Es wird in allen gängigen Browsern unterstützt.

Wir verwenden hier window , vorausgesetzt, dass unsere Umgebung ein Browser ist. Wenn Ihr Skript möglicherweise in anderen Umgebungen ausgeführt wird, ist es besser, stattdessen globalThis zu verwenden.

Auf alle Eigenschaften des globalen Objekts kann direkt zugegriffen werden:

 alarm("Hallo");
// ist dasselbe wie
window.alert("Hallo");

In einem Browser werden globale Funktionen und Variablen, die mit var (nicht let/const !) deklariert wurden, zur Eigenschaft des globalen Objekts:

 var gVar = 5;

alarm(window.gVar); // 5 (wurde eine Eigenschaft des globalen Objekts)

Funktionsdeklarationen haben den gleichen Effekt (Anweisungen mit function im Hauptcodefluss, keine Funktionsausdrücke).

Bitte verlassen Sie sich nicht darauf! Dieses Verhalten besteht aus Kompatibilitätsgründen. Moderne Skripte verwenden JavaScript-Module, wo so etwas nicht passiert.

Wenn wir stattdessen let verwenden würden, würde so etwas nicht passieren:

 sei gLet = 5;

alarm(window.gLet); // undefiniert (wird nicht zu einer Eigenschaft des globalen Objekts)

Wenn ein Wert so wichtig ist, dass Sie ihn global verfügbar machen möchten, schreiben Sie ihn direkt als Eigenschaft:

 // aktuelle Benutzerinformationen global machen, damit alle Skripte darauf zugreifen können
window.currentUser = {
  Name: „John“
};

// irgendwo anders im Code
alarm(aktuellerBenutzername);  // John

// oder, wenn wir eine lokale Variable mit dem Namen „currentUser“ haben
// es explizit aus dem Fenster holen (sicher!)
alarm(window.currentUser.name); // John

Von der Verwendung globaler Variablen wird jedoch generell abgeraten. Es sollten möglichst wenige globale Variablen vorhanden sein. Der Codeentwurf, bei dem eine Funktion „Eingabe“-Variablen erhält und bestimmte „Ergebnisse“ erzeugt, ist klarer, weniger fehleranfällig und einfacher zu testen, als wenn sie äußere oder globale Variablen verwendet.

Verwendung für Polyfills

Wir verwenden das globale Objekt, um die Unterstützung moderner Sprachfunktionen zu testen.

Testen Sie beispielsweise, ob ein integriertes Promise Objekt vorhanden ist (in wirklich alten Browsern ist dies nicht der Fall):

 if (!window.Promise) {
  alarm("Ihr Browser ist wirklich alt!");
}

Wenn es keine gibt (z. B. in einem alten Browser), können wir „Polyfills“ erstellen: Funktionen hinzufügen, die von der Umgebung nicht unterstützt werden, aber im modernen Standard vorhanden sind.

 if (!window.Promise) {
  window.Promise = ... // Benutzerdefinierte Implementierung der modernen Sprachfunktion
}

Zusammenfassung

• Das globale Objekt enthält Variablen, die überall verfügbar sein sollten.

  Dazu gehören integrierte JavaScript-Funktionen wie Array und umgebungsspezifische Werte wie window.innerHeight – die Fensterhöhe im Browser.

• Das globale Objekt hat einen universellen Namen globalThis .

  …Aber häufiger wird auf umgebungsspezifische Namen der „alten Schule“ verwiesen, z. B. window (Browser) und „ global (Node.js).

• Wir sollten Werte nur dann im globalen Objekt speichern, wenn sie für unser Projekt wirklich global sind. Und halten Sie ihre Anzahl auf ein Minimum.

• Sofern wir keine Module verwenden, werden globale Funktionen und Variablen, die mit var deklariert werden, im Browser zu einer Eigenschaft des globalen Objekts.

• Um unseren Code zukunftssicher und verständlicher zu machen, sollten wir direkt auf die Eigenschaften des globalen Objekts zugreifen, als window.x .