js中發(fā)布訂閱模式的示例分析

這篇文章主要介紹js中發(fā)布訂閱模式的示例分析，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

代碼

//發(fā)布訂閱模式
class EventEmiter{
  constructor(){
    //維護一個對象
    this._events={

    }
  }
  on(eventName,callback){
    if( this._events[eventName]){
      //如果有就放一個新的
      this._events[eventName].push(callback);
    }else{
      //如果沒有就創(chuàng)建一個數(shù)組
      this._events[eventName]=[callback]
    }
  }
  emit(eventName,...rest){
    if(this._events[eventName]){ //循環(huán)一次執(zhí)行
      this._events[eventName].forEach((item)=>{
        item.apply(this,rest)
      });
    }
  }
  removeListener(eventName,callback){
    if(this._events[eventName]){
      //當(dāng)前數(shù)組和傳遞過來的callback相等則移除掉
      this._events[eventName]=
        this._events[eventName].filter(item=>item!==callback);
    }
  }
  once(eventName,callback){
    function one(){
      //在one函數(shù)運行原來的函數(shù)，只有將one清空
      callback.apply(this,arguments);
      //先綁定 執(zhí)行后再刪除
      this.removeListener(eventName,one);
    }
    this.on(eventName,one);
      //此時emit觸發(fā)會執(zhí)行此函數(shù)，會給這個函數(shù)傳遞rest參數(shù)
  }
}
class Man extends EventEmiter{}
let man=new Man()
function findGirl() {
  console.log('找新的女朋友')
}
function saveMoney() {
  console.log('省錢')
}
man.once('失戀',findGirl);
//man.on('失戀',findGirl) //失戀 ，綁定一個函數(shù)方法
man.on('失戀',saveMoney)//失戀 ，綁定一個函數(shù)方法
man.removeListener('失戀',saveMoney); //移除一個函數(shù)方法
man.emit('失戀');
//綁定一次，觸發(fā)多次，也只執(zhí)行一次。觸發(fā)后一次將數(shù)組中的哪一項刪除掉下次觸發(fā)就不會執(zhí)行

以上是“js中發(fā)布訂閱模式的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對大家有幫助，更多相關(guān)知識，歡迎關(guān)注億速云行業(yè)資訊頻道！