Window.window — Eigenschaft · JavaScript-Referenz

Signatur

Window.window

Beschreibung

Die Eigenschaft window eines Window-Objekts zeigt auf dasselbe Objekt zurück. Es gilt also window.window === window und sogar window.window.window === window. Das wirkt zunächst überflüssig, hat aber einen Grund: Im Browser ist das Window-Objekt das globale Objekt. Über die Eigenschaft window lässt sich das globale Objekt mit einem Namen ansprechen, genauso wie self oder globalThis.

Man verwendet window vor allem, um ausdrücklich auf globale Variablen und Browser-APIs zuzugreifen, z. B. window.location, window.localStorage oder eigene globale Konfigurationsobjekte. Das macht den Code lesbarer und verhindert, dass eine gleichnamige lokale Variable die globale verdeckt. Außerdem kann man mit typeof window !== "undefined" prüfen, ob der Code überhaupt in einem Browser-Fenster läuft.

Genau genommen liefert window einen WindowProxy. Dieser Proxy bleibt derselbe, auch wenn im Fenster ein neues Dokument geladen wird, und zeigt dann auf das jeweils aktuelle Window-Objekt. Für die tägliche Arbeit ist dieser Unterschied kaum spürbar.

Rückgabewert

Typ

WindowProxy

Beschreibung

Eine Referenz auf das eigene Window-Objekt (als WindowProxy). Die Eigenschaft ist schreibgeschützt.

Beispiele

Selbstreferenz prüfen

console.log(window.window === window);
console.log(window.window.window === window);
console.log(window === globalThis);
console.log(window === self);

true true true true

Globale Variable trotz Verdeckung erreichen

var appName = "Shop"; // mit var auf oberster Ebene → Eigenschaft von window

const zeigeName = () => {
  const appName = "lokal";
  console.log(appName);        // lokale Variable
  console.log(window.appName); // globale Eigenschaft
};

zeigeName();

lokal Shop

Browser-Umgebung erkennen (SSR/Node.js-sicher)

const istBrowser = typeof window !== "undefined" && window.window === window;

const ladeTheme = () => {
  if (!istBrowser) return "light"; // Fallback auf dem Server
  return window.localStorage.getItem("theme") ?? "light";
};

console.log(ladeTheme());

light

Globale Konfiguration explizit anlegen

window.APP_CONFIG = {
  apiBase: "https://api.example.com",
  debug: false
};

const holeNutzer = async (id) => {
  const res = await fetch(`${window.APP_CONFIG.apiBase}/users/${id}`);
  return res.json();
};

console.log(window.APP_CONFIG.apiBase);

https://api.example.com

// Wichtig · Fallstricke

Nicht überall vorhanden: In Web Workern, Service Workern und Node.js gibt es kein window – ein Zugriff wirft einen ReferenceError. Für umgebungsunabhängigen Code globalThis (ES2020) verwenden oder vorher mit typeof window prüfen.
let/const/class landen nicht auf window: Nur mit var oder function auf oberster Ebene deklarierte Namen werden Eigenschaften von window. In ES-Modulen (type="module") gilt nicht einmal das.
Schreibgeschützt: window.window = … wird ignoriert (im Strict Mode gibt es einen TypeError). Die Eigenschaft ist außerdem nicht konfigurierbar.
Frames: In einem <iframe> verweist window auf das Fenster des Frames, nicht auf die übergeordnete Seite. Dafür gibt es window.parent und window.top. Bei fremden Ursprüngen blockiert die Same-Origin-Policy die meisten Eigenschaften.
Globale Variablen auf window anzulegen verschmutzt den globalen Namensraum und kann mit Skripten von Drittanbietern kollidieren – besser Module verwenden.
Wird von allen Browsern unterstützt.

Siehe auch

Window Window.self globalThis Window.parent Window.top Window.frames Touch.target