Snippet

Typsicherer Reaktiver Event-Emitter mit Privaten Symbol-Schlüsseln und WeakRefs

Event-Emitter-Implementierungen können leicht Speicherlecks verursachen, wenn Listener starke Referenzen auf verworfene Objekte behalten. Dieses Muster erstellt einen benutzerdefinierten Event-Kanal unter Verwendung von nativen JavaScript WeakRef-Primitiven zusammen mit privaten Klassenfeldern und Symbol-Bezeichnern. In WeakRefs gehaltene Callbacks können vom Garbage Collector bereinigt werden, wenn keine anderen starken Referenzen existieren.

snippet.js

javascript

const EVENT_KEY = Symbol('CUSTOM_SYSTEM_EVENT');
 
export class ReactiveChannel {
  #listeners = new Set();
 
  subscribe(handler) {
    const reference = new WeakRef(handler);
    this.#listeners.add(reference);
    return () => this.#listeners.delete(reference);
  }
 
  publish(payload) {
    for (const refItem of this.#listeners) {
      const handler = refItem.deref();
      if (handler) {
        handler({ type: EVENT_KEY, payload });
      } else {
        this.#listeners.delete(refItem);
      }
    }
  }
}

vue

Erklärung

const EVENT_KEY = Symbol('CUSTOM_SYSTEM_EVENT');

Erstellt einen eindeutigen Symbol-Bezeichner als unveränderlichen Event-Themenschlüssel.

#listeners = new Set();

Deklariert ein privates ECMAScript-Klassenfeld, das ein Set von Listener-Referenzen enthält.

const reference = new WeakRef(handler);

Hüllt den Callback-Handler in ein WeakRef-Objekt ein, um eine Garbage Collection der Zielfunktion zu ermöglichen.

const handler = refItem.deref();

Versucht, die Ziel-Callback-Funktion aufzulösen, sofern sie noch nicht vom Garbage Collector entfernt wurde.

this.#listeners.delete(refItem);

Entfernt tote WeakRef-Instanzen aus dem Listener-Set, wenn deref() undefined zurückgibt.

Vorheriges Snippet Nächstes Snippet

Mehr JavaScript-Übungen für Experten →

Typsicherer Reaktiver Event-Emitter mit Privaten Symbol-Schlüsseln und WeakRefs

Verwandt