本文分4个部分介绍
1.什么是观察者模式
2.观察者模式的应用场景
3.观察者模式的优缺点
4.观察者模式的简单实现

一.什么是观察者模式
观察者模式里有两个对象 观察者 和 发生的事件。
观察者对发生的事件有兴趣。

观察者模式 解决1对多的关系；
其中有一个比较难的思维点 就是 某人对某个事情敢兴趣，不是自己一直盯着那个事情，而是发生的事件对象 去通知对这个事情敢兴趣的人。

二.应用场景
多个业务关心一个数据的的变化时可以采用这个模式。

三.优缺点
优点：很好的组织了观察者逻辑，以后业务逻辑变化，增删 观察者就可以；
缺点：观察者太多，可能执行时间过长，需要对观察者做优先级处理

四.简单实现

// 观察者模式 简单实现

// 收集对发生的事情有兴趣的人
class Dep {
  constructor() {
//存储对事情敢兴趣的人
    this.watchers = [];
  }
//收集对事情敢兴趣的人
  addDep(watcher) {
    this.watchers.push(watcher);
  }

  // 事件发生时通知所有人
  notifys() {
    this.watchers.forEach((item) => {
      item.notify();
    });
  }
}

// 观察者 对发生的事情敢兴趣的人
class Watcher {
//name是观察者的标记名称 fun是事件发生时要干的事情
  constructor(name, fun) {
    this.name = name;
    this.doneFun = fun;
  }

  notify() {
    console.log('我是-' + this.name + '-观察者');
    if (typeof this.doneFun === 'function') {
      this.doneFun();
    }
  }
}

//这里是举例执行
//假设有个对象 a={name:''},有3个观察者 好奇1,2,3号对a对象是否改变了name有兴趣，代码就可以这样写
const a={name:'牛大爷'}
const Deps = new Dep();
Deps.addDep(new Watcher('好奇者1号'));
Deps.addDep(new Watcher('好奇者2号'));
Deps.addDep(new Watcher('好奇者3号'));
//牛大爷下面决定改名称了 
a.name='你大爷'；
//这样好奇者 1,2,3号就都知道牛大爷改名字了
Deps.notifys();