javascript 觀察者模式(訂閱者模式)

簡單理解邏輯:

A發(fā)布一個消息 ,如果B,C,D都訂閱了這個事件,則會將所有訂閱著訂閱的消息依此執(zhí)行。

常見的使用場景:

vuejs框架數(shù)據(jù)修改,視圖直接改變,這里就是采用的觀察者模式。

開始:

首先要編寫注冊/發(fā)布/注銷三個函數(shù)

var Demo=function(){

? ? var _message={};

? ? var that=this;

? ? //注冊

? ? that.regist=function(type,fn){

? ? ? ? ? if(typeof _message[type]==="undefined"){

? ? ? ? ? ? ? ? ? ? _message[type]=[fn]

? ? ? ? ?}else{

? ? ? ? ? ? ? ? ? _message[type].push(fn)

? ? ? ? }

? ?}

? ? //發(fā)布

? ? that.fire=function(type,args){

? ? ? ? if(!_message[type]){return;}

? ? ? ? var i=0,len=_message.[type].length;

? ? ? ? for(;i<len;i++){

? ? ? ? ? ? ? ? _message[type][i].call(this,args);//觸發(fā)regist的時候存入到_message[type]的回調(diào)函數(shù)

? ? ? ? }

? ? }

? ? //注銷

? ? that.remove=function(type,fn){

? ? ? ? ? ? if(_message[type] instanceof Array){

? ? ? ? ? ? ? ? ? ? ? var i=_message[type]length-1;

? ? ? ? ? ? ? ? ? ? ? for(;i>=0;i--){

? ? ? ? ? ? ? ? ? ? ? ? ? ? _message[type][i]===fn && _message[type].splice(i,1)

? ? ? ? ? ? ? ? ? ? ? }

? ? ? ? ? ? }

? ? ?}

}

使用:

var observer=new Demo();

//訂閱

observer.regist("test",function(e){e()});

observer.regist("test",function(e){console.log("這個訂閱也會觸發(fā)")});

//發(fā)布

observer.fire("test",function(){

? ? ? alert("這里是業(yè)務(wù)邏輯")

})

當(dāng)fire發(fā)布test,則訂閱test的消息會依次執(zhí)行;

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 單例模式 適用場景:可能會在場景中使用到對象,但只有一個實(shí)例,加載時并不主動創(chuàng)建,需要時才創(chuàng)建 最常見的單例模式,...
    Obeing閱讀 2,320評論 1 10
  • 工廠模式類似于現(xiàn)實(shí)生活中的工廠可以產(chǎn)生大量相似的商品,去做同樣的事情,實(shí)現(xiàn)同樣的效果;這時候需要使用工廠模式。簡單...
    舟漁行舟閱讀 8,131評論 2 17
  • 面向?qū)ο缶幊?1.創(chuàng)建,使用函數(shù) var CheckObject = {checkName : function(...
    依米花1993閱讀 466評論 0 0
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,661評論 19 139
  • 晚上十點(diǎn),定了鬧鐘準(zhǔn)備睡了。突然覺得,這樣的日復(fù)一日讓我好難過。 我記得從去年夏天開始 我再也沒有喝醉過。 沒給人...
    攝影師Utopia閱讀 356評論 3 1

友情鏈接更多精彩內(nèi)容