订阅/发布模式

订阅发布模式

在这种模式中,并不是⼀个对象调⽤另⼀个对象的⽅法,⽽是⼀个对象订阅另⼀个对象的 特定活动并在
状态改编后获得通知。订阅者因此也成为观察者,⽽被观察的对象成为发布者或者主题。当发⽣了⼀个
重要事件时候 发布者会通知(调⽤)所有订阅者并且可能经常已事件对象的形式传递消息

vue中的 emit, on源码 ⼤概也是这个样⼦ vue源码

完整的演示代码

class A {
  constructor() {
    // 存储事件
    this.callbacks = {};
  }
  $on(name, fn) {
    (this.callbacks[name] || (this.callbacks[name] = [])).push(fn);
  }
  $emit(name, arg) {
    let cbs = this.callbacks[name];
    if (cbs) {
      cbs.forEach(v => {
        v.call(this, arg);
      });
    }
  }
  $off(name) {
    this.callbacks[name] = null;
  }
}

var a = new A();

// 绑定事件
a.$on("event", function(arg) {
  console.log("事件1", arg);
});

a.$on("event2", function(arg) {
  console.log("事件2", arg);
});

// 触发事件
a.$emit("event", { name: "sh" });

// 取消事件
a.$off("event");

// 取消之后尝试触发事件
a.$emit("event", { name: "sh" });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值