观察者模式

观察者模式（又称发布-订阅者模式）；观察对象主要是消息容器和注册、触发、移除 三个方法；
作用：解耦相互依赖的对象，对任意的订阅者来说，其他订阅者改变不会影响自身；自身既可以是消息注册者也可以是消息发布者；

const observe = (function () {
  // 消息容器
  const map = new Map();
  return {
    // 订阅（注册）消息
    regiest(type, fn) {
      map.set(type, map.has(type) ? [...map.get(type), fn] : [fn]);
    },
    // 发布消息
    fire(type, args) {
      if (!map.has(type)) return;
      const data = { type, args };
      map.get(type).forEach((fn) => {
        fn.call(this, data);
      });
    },
    // 移除消息
    remove(type, fn) {
      if (!map.has(type)) return;
      let list = map.get(type);
      let len = list.length - 1;
      while (len >= 0) {
        list[len] === fn && list.splice(len, 1);
        len--;
      }
      map.set(type, list);
    },
  };
})();

试一下

// 注册
observe.regiest("listen1", (args) => {
  console.log("listen1 regiest", args);
});
const fn2 = (args) => {
  console.log("fn2", args);
};
// 注册
observe.regiest("listen1", fn2);
// 发布
observe.fire("listen1", 123); // listen1 regiest  / fn2
// 移除
observe.remove("listen1", fn2);
// 注册
observe.fire("listen1", 456); // listen1 regiest {type: 'listen1', args: 456}