WorkerGlobalScope.self — Eigenschaft · JavaScript-Referenz

Signatur

WorkerGlobalScope.self

Beschreibung

In einem Web Worker gibt es kein window. Das globale Objekt ist dort eine Instanz von WorkerGlobalScope, genauer von einer Unterklasse wie DedicatedWorkerGlobalScope, SharedWorkerGlobalScope oder ServiceWorkerGlobalScope. Über self kommt man ausdrücklich an dieses globale Objekt heran, etwa um Event-Listener zu registrieren (self.addEventListener('message', …)) oder Nachrichten zu senden (self.postMessage()).

Weil es self auch im Hauptthread gibt (dort ist window.self === window), eignet sich die Eigenschaft gut für Code, der sowohl im Fenster als auch im Worker laufen soll. Für wirklich umgebungsunabhängigen Code, der auch in Node.js funktioniert, nimmt man heute besser globalThis (ES2020).

Die Eigenschaft ist schreibgeschützt und hat keine Parameter. Rückgabewert ist immer das Objekt, das auch globalThis und this auf oberster Ebene eines klassischen Worker-Skripts liefern.

Rückgabewert

Typ

WorkerGlobalScope

Beschreibung

Das globale Objekt des Workers, je nach Worker-Typ ein DedicatedWorkerGlobalScope, SharedWorkerGlobalScope oder ServiceWorkerGlobalScope.

Beispiele

Nachrichten im Dedicated Worker empfangen und beantworten

// worker.js
self.addEventListener('message', (event) => {
  const zahlen = event.data;
  const summe = zahlen.reduce((a, b) => a + b, 0);
  self.postMessage({ summe });
});

// main.js
const worker = new Worker('worker.js');
worker.addEventListener('message', (e) => console.log('Summe:', e.data.summe));
worker.postMessage([1, 2, 3, 4]);

Summe: 10

Typ des globalen Scopes prüfen

// worker.js
console.log(self instanceof WorkerGlobalScope);
console.log(self.constructor.name);
console.log(self === globalThis);
console.log(typeof window);

true DedicatedWorkerGlobalScope true undefined

Service Worker: Install-Event über self

// sw.js
const CACHE = 'app-v1';

self.addEventListener('install', (event) => {
  event.waitUntil(
    caches.open(CACHE).then((cache) => cache.addAll(['/', '/index.html', '/app.js']))
  );
  self.skipWaiting();
});

self.addEventListener('fetch', (event) => {
  event.respondWith(
    caches.match(event.request).then((res) => res ?? fetch(event.request))
  );
});

Code, der im Fenster und im Worker läuft

// shared.js – wird per <script> und per importScripts() geladen
const istWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope;
console.log(istWorker ? 'Läuft im Worker' : 'Läuft im Hauptthread');

// self zeigt in beiden Fällen auf das globale Objekt
self.appVersion = '1.2.0';
console.log(globalThis.appVersion);

Läuft im Worker 1.2.0

// Wichtig · Fallstricke

Kein window: In Workern führt window zu einem ReferenceError. Nimm self oder globalThis.
self vs. globalThis: self gibt es nur in Browser-Umgebungen (Fenster und Worker). In Node.js ist self erst ab Version 22 als globales Objekt vorhanden, in älteren Versionen nicht. Für plattformübergreifende Bibliotheken ist globalThis daher die sicherere Wahl.
Überschattung: Eine lokale Variable namens self (etwa das alte Muster const self = this;) verdeckt das globale self. Solche Namen solltest du in Worker-Code vermeiden.
this auf oberster Ebene: In klassischen Workern gilt this === self. In Modul-Workern (new Worker(url, { type: 'module' })) ist this auf oberster Ebene dagegen undefined. self funktioniert in beiden Fällen.
Sicherheit: Prüfe bei self.addEventListener('message', …) in Shared und Service Workern die Herkunft und den Inhalt eingehender Daten, bevor du sie verarbeitest.
Kompatibilität: Wird von allen modernen Browsern unterstützt, auch in Dedicated, Shared und Service Workern.

Siehe auch

Window.self WorkerGlobalScope.fonts WorkerGlobalScope.caches WorkerGlobalScope.crypto WorkerGlobalScope.origin