JS发布订阅模式

class Subscribe{

  constructor(){

    // 维护注册列表

    this.list = []

  }

  // 

  on(name,user,fn){

    this.list.push({

      "name":name,

      "user":user,

      "fn":fn

    })

    console.log(user + "订阅了" + name)

  }

  off(name,user){

    // 遍历删除,达到取消订阅效果

    this.list.forEach((item,index)=>{

      if(item.name == name && item.user == user){

        this.list.splice(index,1)

      }



    })

  }

  emit(name,content){

    // 触发事件

    this.list.forEach(item=>{

      if(item.name = name){

        console.log("给" + item.user + "发信息")

        item.fn(content)

      }

    })



  }

}

let subscribe = new Subscribe();

subscribe.on(

  "湖人",

  "wuyz",

  function(content){

    console.log("lbjmvp")

    console.log(content)

})

subscribe.emit("湖人","hhh")

subscribe.off("湖人","wuyz")

subscribe.emit("湖人","hhh")



————————————————————————————————————————————————————————



class Subscribe {

  constructor () {

    this.list = []

  }



  on (id, name, fn) {

    const index = this.list.find(v => v.id === id)

    if (index) {

      console.log('订阅ID重复');

      return

    }

    this.list.push({id, name, fn})

  }



  emit (name, params) {

    const current = this.list.find(v => v.name === name)

    if (current) {

      current.fn(params)

    }

  }



  off (id) {

    const index = this.list.findIndex(v => v.id === id)

    if (index > -1) {

      this.list.splice(index, 1)

    }

  }



}



const subscribe = new Subscribe()





subscribe.on(1, 'input', (params) => {

  console.log('input', params);

})



subscribe.on(1, 'input', (params) => {

  console.log('input', params);

})



subscribe.on(2, 'input2', (params) => {

  console.log('input2', params);

})



subscribe.emit('input2', {name: 'HHHHH222', age: '21'})

subscribe.emit('input', {name: 'HHHHH1111', age: '11'})

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值