globalThis

Probieren Sie es aus

function canMakeHTTPRequest() {
  return typeof globalThis.XMLHttpRequest === "function";
}

console.log(canMakeHTTPRequest());
// Expected output (in a browser): true

Wert

Das globale this-Objekt.

Beschreibung

Historisch gesehen erforderte der Zugriff auf das globale Objekt unterschiedliche Syntax in verschiedenen JavaScript-Umgebungen. Im Web knnen Sie window, self oder frames verwenden - aber in Web Workers funktioniert nur self. In Node.js funktioniert keine dieser Mglichkeiten, stattdessen muss global verwendet werden. Das this-Schlsselwort konnte in Funktionen verwendet werden, die im nicht-strikten Modus ausgefhrt wurden, aber this wird in Modulen und innerhalb von Funktionen im strikten Modus undefined sein. Sie knnen auch Function('return this')() verwenden, aber Umgebungen, die eval() deaktivieren, wie CSP in Browsern, verhindern die Verwendung von Function auf diese Weise.

Die globalThis-Eigenschaft bietet eine standardisierte Mglichkeit, den globalen this-Wert (und damit das globale Objekt selbst) ber Umgebungen hinweg zuzugreifen. Im Gegensatz zu hnlichen Eigenschaften wie window und self ist sie garantiert in Fenster-und Nicht-Fenster-Kontexten funktionsfhig. Auf diese Weise knnen Sie auf das globale Objekt in konsistenter Weise zugreifen, ohne wissen zu mssen, in welcher Umgebung der Code ausgefhrt wird. Um Ihnen zu helfen, den Namen zu merken: Im globalen Bereich ist der this-Wert globalThis.

HTML und der WindowProxy

In vielen Engines wird globalThis eine Referenz auf das eigentliche globale Objekt sein, aber in Webbrowsern, aufgrund von Sicherheitsberlegungen bei iframes und Fenster-bergreifenden Zugriffen, verweist es auf einen Proxy um das eigentliche globale Objekt (auf das Sie nicht direkt zugreifen knnen). Diese Unterscheidung ist im allgemeinen Gebrauch selten relevant, aber wichtig zu wissen.

Namensgebung

Mehrere andere beliebte Namensoptionen wie self und global wurden aus der berlegung ausgeschlossen, da sie die Kompatibilitt mit bestehendem Code gefhrden knnten. Fr weitere Details siehe das Dokument zur Namensgebung des Sprachvorschlags.

globalThis ist, ganz wrtlich, der globale this-Wert. Es ist derselbe Wert wie der this-Wert in einer nicht-strikten Funktion, die ohne ein Objekt aufgerufen wird. Es ist auch der Wert von this im globalen Bereich eines Skripts.

Beispiele

Suche nach dem Globalen ber Umgebungen hinweg

Normalerweise muss das globale Objekt nicht explizit angegeben werden seine Eigenschaften sind automatisch als globale Variablen zugnglich.

console.log(window.Math === Math); // true

Ein Fall, in dem man jedoch explizit auf das globale Objekt zugreifen muss, ist, wenn man darauf schreiben mchte, blicherweise zu dem Zweck von Polyfills.

Vor globalThis war der einzige zuverlssige plattformbergreifende Weg, das globale Objekt fr eine Umgebung zu erhalten, Function('return this')(). Dies verursacht jedoch CSP-Verletzungen in einigen Einstellungen, weshalb Autoren eine stckweise Definition wie diese verwendeten (leicht angepasst aus der originalen core-js-Quelle):

function check(it) {
  // Math is known to exist as a global in every environment.
  return it && it.Math === Math && it;
}

const globalObject =
  check(typeof window === "object" && window) ||
  check(typeof self === "object" && self) ||
  check(typeof global === "object" && global) ||
  // This returns undefined when running in strict mode
  (function () {
    return this;
  })() ||
  Function("return this")();

Nachdem das globale Objekt erhalten wurde, knnen wir neue Globale darauf definieren. Zum Beispiel das Hinzufgen einer Implementierung fr Intl:

if (typeof globalObject.Intl === "undefined") {
  // No Intl in this environment; define our own on the global scope
  Object.defineProperty(globalObject, "Intl", {
    value: {
      // Our Intl implementation
    },
    enumerable: false,
    configurable: true,
    writable: true,
  });
}

Mit globalThis verfgbar, ist die zustzliche Suche nach dem Globalen ber Umgebungen hinweg nicht mehr notwendig:

if (typeof globalThis.Intl === "undefined") {
  Object.defineProperty(globalThis, "Intl", {
    value: {
      // Our Intl implementation
    },
    enumerable: false,
    configurable: true,
    writable: true,
  });
}

Spezifikationen

Browser-Kompatibilitt

Siehe auch

• Polyfill von globalThis in core-js
• es-shims Polyfill von globalThis
• this