Das Muster observer ermöglicht die Definition einer Eins-zu-viele-Abhängigkeit zwischen Objekten, sodass alle abhängigen Objekte automatisch benachrichtigt und aktualisiert werden, wenn ein Objekt seinen Status ändert.

In diesem Beispiel erstellen wir ein einfaches Klassenprodukt, das andere Klassen beim Registrieren von Änderungen in der Methode register() beobachten können. Wenn etwas aktualisiert wird, kommuniziert die Methode notifyAll() mit allen Beobachtern über diese Änderungen.

class ObservedProduct {
  constructor() {
    this.price = 0;
    this.actions = [];
  }

  setBasePrice(val) {
    this.price = val;
    this.notifyAll();
  }

  register(observer) {
    this.actions.push(observer);
  }

  unregister(observer) {
    this.actions.remove.filter(function (el) {
      return el !== observer;
    });
  }

  notifyAll() {
    return this.actions.forEach(
      function (el) {
        el.update(this);
      }.bind(this)
    );
  }
}

class Fees {
  update(product) {
    product.price = product.price * 1.2;
  }
}

class Profit {
  update(product) {
    product.price = product.price * 2;
  }
}

export { ObservedProduct, Fees, Profit };

Ein vollständiges Beispiel finden Sie hier? https://stackblitz.com/edit/vitejs-vite-kyucyd?file=main.js

Abschluss

Verwenden Sie dieses Muster, wenn Änderungen am Zustand eines Objekts möglicherweise die Änderung anderer Objekte erfordern und der tatsächliche Satz von Objekten vorher unbekannt ist oder sich dynamisch ändert.

Ich hoffe, Sie fanden es hilfreich. Danke fürs Lesen. ?

Lassen Sie uns in Kontakt treten! Sie finden mich unter:

• Medium: https://medium.com/@nhannguyendevjs/
• Entwickler: https://dev.to/nhannguyendevjs/
• Hashnode: https://nhannguyen.hashnode.dev/
• Linkedin: https://www.linkedin.com/in/nhannguyendevjs/
• X (ehemals Twitter): https://twitter.com/nhannguyendevjs/
• Kauf mir einen Kaffee: https://www.buymeacoffee.com/nhannguyendevjs