手写JS（五）--实现观察者模式

// push版（一个事件发生后通知所有观察者，把所有新数据传给每个观察者）
const Observable1 = {
  observers: [],
  addObserver: function(observer) {
    this.observers.push(observer);
  },
  removeObserver: function(observer) {
    const index = this.observers.indexOf(observer);
    if(index >= 0) {
      this.observers.splice(index, 1);
    } else {
      throw new Error('没有找到要删除的观察者');
    }
  },
  publishMessage: function(message) {
    this.observers.forEach(observer => {
      observer(message);
    })
  }
}
// pull版（一个事件发生后，每个观察者主动拉取数据）
const Observable2 = {
  message: null,
  observers: [],
  // 增加和删除方法同上
  addObserver: function(observer) {
    this.observers.push(observer);
  },
  removeObserver: function(observer) {
    const index = this.observers.indexOf(observer);
    if(index >= 0) {
      this.observers.splice(index, 1);
    } else {
      throw new Error('没有找到要删除的观察者');
    }
  },
  // 执行每个observer时候不把message发出去
  publishMessage: function(message) {
    this.message = message;
    this.observers.forEach(observer => {
      observer();
    })
  },
  // 每个obser主动获取message
  getMessage: function() {
    return this.message;
  }
}


// 调用示例
const observer = function(message) {
  console.log('我收到了信息:' + message);
}
const observer2 = function(message) {
  console.log('我收到了信息2:' + message);
}

Observable1.addObserver(observer);
Observable1.addObserver(observer2);
Observable1.removeObserver(observer);
Observable1.publishMessage('这是一条信息');

const observer3 = function() {
  const message = Observable2.getMessage();
  console.log('我收到了信息:' + message);
}

Observable2.addObserver(observer3);
Observable2.publishMessage('这条信息需要你自己pull')