JavaScript设计模式之观察者模式

发布者和订阅者之间松耦合（发布者直接通知订阅者）

适用场景：一个地方发生了更改，通知其他好几个地方进行相应的更改，多用于应用内部。

1. ES5实现方式

   var Subject = function () {
     this.observers = []
   }
   Subject.prototype.addObserver = function(observer) {
     this.observers.push(observer)
   }
   Subject.prototype.removeObserver = function(observer) {
     var index = this.observers.indexOf(observer)
     index > -1 && this.observers.splice(index, 1)
   }
   Subject.prototype.notify = function() {
     this.observers.forEach(function(item, index) {
       item.update()
     })
   }

   var Observer = function(name) {
     this.name = name
   }
   Observer.prototype.update = function() {
     console.log(this.name + 'update....')
   }

   var subject = new Subject()
   var observer1 = new Observer('订阅者1号')
   subject.addObserver(observer1)
   var observer2 = new Observer('订阅者2号')
   subject.addObserver(observer2)
   subject.notify()
   subject.removeObserver(observer1)
   subject.notify()

2. ES6实现方式

   class Subject {
     constructor() {
       this.observers = [];
     }
     addObserver(observer) {
       this.observers.push(observer);
     }
     removeObserver(observer) {
       let index = this.observers.indexOf(observer);
       index > -1 && this.observers.splice(index, 1);
     }
     notify() {
       this.observers.forEach(observer => observer.update());
     }
   }

   class Observer {
     constructor(name) {
       this.name = name;
     }
     update() {
       console.log(this.name + "update....");
     }
     subscribeTo(subject) {
       subject.addObserver(this);
     }
   }
   var subject = new Subject();
   var observer1 = new Observer("订阅者1号");
   observer1.subscribeTo(subject);
   subject.notify();
   subject.removeObserver(observer1);
   subject.notify();