This paper serves as a learning record (welcome to point out any misunderstanding)

Observer model

What problem does the observer model solve

Many designs often involve multiple objects interested in data changes in a particular object, and they all want to track data changes in that particular object. That is, the observer pattern can be used when there is a one-to-many relationship between objects. When an object is modified, its dependent objects are automatically notified.

The observer pattern is a mature pattern for multiple objects that want to know how the data in one object is changing. The observer mode has one object called “topic” and several objects called “observers”. There is a one-to-many dependency between “topic” and “observers”. When the state of “topic” changes, all “observers” are notified.

Main solution: one object state changes to notify other objects of the problem, but also to take into account the ease of use and low coupling, to ensure a high degree of collaboration.

Constructor () {this.observer = []; } addOberser(oberser) { this.observer.push(oberser); } cancelOberser(oberser) { this.observer = this.observer.filter(item => item ! == oberser); } notify() { this.observer.forEach(i => i.update()); } } class Oberver { constructor(name) { this.name = name; } update() { console.log(`my name updateing ${this.name}`) } } let test = new SubJect(); Let person1 = new Oberver('person: Nannan '); Let person2 = new Oberver('person: cub '); test.addOberser(person1); test.addOberser(person2); test.cancelOberser(person1); test.notify();Copy the code

Advantages: : The observer pattern meets the “open-closed principle”, the topic interface only depends on the observer interface, so that the class that creates the specific topic also depends on the observer interface, so if you add a new class that implements the observer interface, you do not need to modify the code of the class that creates the specific topic. Similarly, the class that creates a concrete observer depends only on the topic interface, and if you add a new class that implements the topic interface, you don’t have to modify the code that creates the concrete observer class.

Disadvantages: If there is a cyclic dependency between the observer and the observation target, the observation target will trigger a cyclic call between them (if Oberver is also an observation target above), possibly causing the system to crash. The observer mode has no corresponding mechanism to let the observer know how the observed object has changed, but only that the observed object has changed.

Publish and subscribe model

What problems does the publish-subscribe model solve

This pattern is used as a dispatch center or commodity hub, an agent that links publishers and subscribers together. A publisher is an object that fires an event when some process is completed or a product is released, and a subscriber is an object that wants to be notified when a publisher publishes.

Main solution: Let publishers publish messages and subscribers receive messages rather than finding a way to link the two systems together.

/ / Class constructor {constructor() {this.products = {}; } subscriberProduct(name, cb) { if (! this.products[name]) this.products[name] = []; this.products[name].push(cb); } publishProduct() { let args = arguments; const name = Array.prototype.shift.call(args); const cbs = this.products[name]; if (! cbs || cbs.length === 0) return; cbs.forEach(cb => cb.apply(this, args)) } cancelSubscriberProduct(name) { delete this.products[name]; } } let appleStore = new Schedule(); AppleStore. SubscriberProduct (' iphone '(time) = > {the console. The log (` focus on the new iphone mobile phone shops release time is ${time} `)}); AppleStore. SubscriberProduct (' iphone '(time) = > {the console. The log (` personal attention for the new iphone release time is ${time} `)}); AppleStore. SubscriberProduct (' macbookPro, (sales) = > {the console. The log (` macbookPro is sales promotion price at RMB ${sales} `)}); appleStore.cancelSubscriberProduct('macbookPro') appleStore.publishProduct('iphone', '2020-10-10'); appleStore.publishProduct('macbookPro', '10000');Copy the code

Advantages: Decoupling between objects. In asynchronous programming, code structure can be organized in a more decoupled way, with more flexibility. There is no need to depend on how the intermediate process is implemented, only that publishers and subscribers share a protocol.

Disadvantages: As with observer mode, the system can crash if there is a cyclic dependency. Secondly, creating the subscriber itself takes some time and memory. The Products object itself is also a cached list.