JavaScript-Entwurfsmuster – Verhalten – Beobachter

DasObserver-Muster 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 Methoderegister()beobachten können. Wenn etwas aktualisiert wird, kommuniziert die MethodenotifyAll()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

Fazit

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 miteinander in Kontakt treten! Du findest mich auf:

• Medium:https://medium.com/@nhannguyendevjs/
• Dev: 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

Das obige ist der detaillierte Inhalt vonJavaScript-Entwurfsmuster – Verhalten – Beobachter. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!