发布订阅和观察者模式

目的

• 实现发布订阅和观察者模式
  

  发布订阅

• 核心就是创造一个事件处理中心，将订阅的任务在任务完成是发布出去，这样说很模糊，代码比较直观

  //发布订阅
  let events = {
  _events: [],
  //收集要处理的任务
  on(fn) {
  this._events.push(fn);
  },
  //发布执行已收集的任务（方法）
  emit(data) {
  this._events.forEach((event) => {
    event(data);
  });
  },
  };
  setTimeout(() => {
  //发布
  events.emit("第一次舔");
  }, 1000);
  setTimeout(() => {
  //发布
  events.emit("第二次舔");
  }, 2000);
  //订阅
  events.on((data) => {
  arr.push(data);
  console.log(data);
  });
  let arr = [];
  events.on(() => {
  if (arr.length === 2) {
  console.log("老子不舔了");
  }
  });

观察者模式

• 存在一个观察者，一个被观察者，当被观察者变化时通知观察者，
• 要实现上面的功能就需要被观察者将所有的观察者收集起来
• 代码如下

  class Subject {
  constructor(name) {
  this.name = name;
  this.state = "非常开心";
  this.observers = [];
  }
  attach(o) {
  this.observers.push(o);
  }
  setState(newState) {
  this.state = newState;
  this.observers.forEach((o) => {
    o.update(this.name, newState);
  });
  }
  }
  class Observer {
  constructor(name) {
  this.name = name;
  }
  update(s, state) {
  console.log(this.name, s + "当前" + state);
  }
  }
  let s = new Subject("小宝宝");
  let o1 = new Observer("爸爸");
  let o2 = new Observer("妈妈");
  s.attach(o1);
  s.attach(o2);
  s.setState("不开心了");
  s.setState("开心了");

  最重要的就是被观察者里的attach要将观察者收集起来，状态改变时setState方法要调用观察者的update方法进行通知