国产99久久精品_欧美日本韩国一区二区_激情小说综合网_欧美一级二级视频_午夜av电影_日本久久精品视频

最新文章專(zhuān)題視頻專(zhuān)題問(wèn)答1問(wèn)答10問(wèn)答100問(wèn)答1000問(wèn)答2000關(guān)鍵字專(zhuān)題1關(guān)鍵字專(zhuān)題50關(guān)鍵字專(zhuān)題500關(guān)鍵字專(zhuān)題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專(zhuān)題關(guān)鍵字專(zhuān)題tag2tag3文章專(zhuān)題文章專(zhuān)題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專(zhuān)題3
問(wèn)答文章1 問(wèn)答文章501 問(wèn)答文章1001 問(wèn)答文章1501 問(wèn)答文章2001 問(wèn)答文章2501 問(wèn)答文章3001 問(wèn)答文章3501 問(wèn)答文章4001 問(wèn)答文章4501 問(wèn)答文章5001 問(wèn)答文章5501 問(wèn)答文章6001 問(wèn)答文章6501 問(wèn)答文章7001 問(wèn)答文章7501 問(wèn)答文章8001 問(wèn)答文章8501 問(wèn)答文章9001 問(wèn)答文章9501
當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解

來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 20:15:19
文檔

javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解

javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解:觀察者模式定義對(duì)象間的一種一對(duì)多的依賴(lài)關(guān)系,以便當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生改變時(shí),所有依賴(lài)于它的對(duì)象都得到通知并自動(dòng)刷新,也被稱(chēng)為是發(fā)布訂閱模式。它需要一種高級(jí)的抽象策略,以便訂閱者能夠彼此獨(dú)立地發(fā)生改變,而發(fā)行方能夠接受任何有消費(fèi)意向的訂閱者。
推薦度:
導(dǎo)讀javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解:觀察者模式定義對(duì)象間的一種一對(duì)多的依賴(lài)關(guān)系,以便當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生改變時(shí),所有依賴(lài)于它的對(duì)象都得到通知并自動(dòng)刷新,也被稱(chēng)為是發(fā)布訂閱模式。它需要一種高級(jí)的抽象策略,以便訂閱者能夠彼此獨(dú)立地發(fā)生改變,而發(fā)行方能夠接受任何有消費(fèi)意向的訂閱者。

觀察者模式

定義對(duì)象間的一種一對(duì)多的依賴(lài)關(guān)系,以便當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生改變時(shí),所有依賴(lài)于它的對(duì)象都得到通知并自動(dòng)刷新,也被稱(chēng)為是發(fā)布訂閱模式。

它需要一種高級(jí)的抽象策略,以便訂閱者能夠彼此獨(dú)立地發(fā)生改變,而發(fā)行方能夠接受任何有消費(fèi)意向的訂閱者。

應(yīng)用場(chǎng)景:  

這個(gè)模式要先說(shuō)應(yīng)用場(chǎng)景,比較好理解。

打一個(gè)離我們比較近的一個(gè)場(chǎng)景,博客園里面有一個(gè)訂閱的按鈕(貌似有bug),比如小A,小B,小C都訂閱了我的博客,當(dāng)我的博客一有更新時(shí),就會(huì)統(tǒng)一發(fā)布郵件給他們這三個(gè)人,就會(huì)通知這些訂閱者

發(fā)布訂閱模式的流程如下:

1. 確定誰(shuí)是發(fā)布者(比如我的博客)。

2. 然后給發(fā)布者添加一個(gè)緩存列表,用于存放回調(diào)函數(shù)來(lái)通知訂閱者。

3. 發(fā)布消息,發(fā)布者需要遍歷這個(gè)緩存列表,依次觸發(fā)里面存放的訂閱者回調(diào)函數(shù)。

4. 退訂(比如不想再接收到這些訂閱的信息了,就可以取消掉)

代碼如下:

var pubsub = {}; // 定義發(fā)布者
(function (q) {
 var list = [], //回調(diào)函數(shù)存放的數(shù)組,也就是記錄有多少人訂閱了我們東西
 subUid = -1;
 // 發(fā)布消息,遍歷訂閱者
 q.publish = function (type, content) {
 // type 為文章類(lèi)型,content為文章內(nèi)容
 // 如果沒(méi)有人訂閱,直接返回
 if (!list[type]) {
 return false;
 }
 setTimeout(function () {
 var subscribers = list[type],
 len = subscribers ? subscribers.length : 0;
 
 while (len--) {
 // 將內(nèi)容注入到訂閱者那里
 subscribers[len].func(type, content);
 }
 }, 0);
 return true;
 };
 //訂閱方法,由訂閱者來(lái)執(zhí)行
 q.subscribe = function (type, func) {
 // 如果之前沒(méi)有訂閱過(guò)
 if (!list[type]) {
 list[type] = [];
 }
 // token相當(dāng)于訂閱者的id,這樣的話(huà)如果退訂,我們就可以針對(duì)它來(lái)知道是誰(shuí)退訂了。
 var token = (++subUid).toString();
 // 每訂閱一個(gè),就把它存入到我們的數(shù)組中去
 list[type].push({
 token: token,
 func: func
 });
 return token;
 };
 //退訂方法
 q.unsubscribe = function (token) {
 for (var m in list) {
 if (list[m]) {
 for (var i = 0, j = list[m].length; i < j; i++) {
 if (list[m][i].token === token) {
 list[m].splice(i, 1);
 return token;
 }
 }
 }
 }
 return false;
 };
} (pubsub));
//將訂閱賦值給一個(gè)變量,以便退訂
var girlA = pubsub.subscribe('js類(lèi)的文章', function (type, content) {
 console.log('girlA訂閱的'+type + ": 內(nèi)容內(nèi)容為:" + content);
});
var girlB = pubsub.subscribe('js類(lèi)的文章', function (type, content) {
 console.log('girlB訂閱的'+type + ": 內(nèi)容內(nèi)容為:" + content);
});
var girlC = pubsub.subscribe('js類(lèi)的文章', function (type, content) {
 console.log('girlC訂閱的'+type + ": 內(nèi)容內(nèi)容為:" + content);
});
//發(fā)布通知
pubsub.publish('js類(lèi)的文章', '關(guān)于js的內(nèi)容');
// 
輸出: // girlC訂閱的js類(lèi)的文章: 內(nèi)容內(nèi)容為:關(guān)于js的內(nèi)容 // test3.html:78 girlB訂閱的js類(lèi)的文章: 內(nèi)容內(nèi)容為:關(guān)于js的內(nèi)容 // test3.html:75 girlA訂閱的js類(lèi)的文章: 內(nèi)容內(nèi)容為:關(guān)于js的內(nèi)容 //girlA退訂了關(guān)于js類(lèi)的文章 setTimeout(function () { pubsub.unsubscribe(girlA); }, 0); //再發(fā)布一次,驗(yàn)證一下是否還能夠輸出信息 pubsub.publish('js類(lèi)的文章', "關(guān)于js的第二篇文章"); // 輸出: // girlB訂閱的js類(lèi)的文章: 內(nèi)容內(nèi)容為:關(guān)于js的第二篇文章 // girlC訂閱的js類(lèi)的文章: 內(nèi)容內(nèi)容為:關(guān)于js的第二篇文章

代碼可以自己運(yùn)行一遍,這樣比較好理解

優(yōu)缺點(diǎn):

優(yōu)點(diǎn):當(dāng)我們需要維護(hù)相關(guān)對(duì)象的一致性的時(shí)候,使用觀察者模式,,就可以避免對(duì)象之間的緊密耦合。例如,一個(gè)對(duì)象可以通知另外一個(gè)對(duì)象,而不需要知道這個(gè)對(duì)象的信息。

缺點(diǎn):在發(fā)布/訂閱模式中,如果我們需要將發(fā)布者同訂閱者上解耦,將會(huì)在一些情況下,導(dǎo)致很難確保我們應(yīng)用中的特定部分按照我們預(yù)期的那樣正常工作。也就是說(shuō)它的優(yōu)點(diǎn)也可能是它的缺點(diǎn)

聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文檔

javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解

javascript觀察者模式定義、場(chǎng)景實(shí)例代碼詳解:觀察者模式定義對(duì)象間的一種一對(duì)多的依賴(lài)關(guān)系,以便當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生改變時(shí),所有依賴(lài)于它的對(duì)象都得到通知并自動(dòng)刷新,也被稱(chēng)為是發(fā)布訂閱模式。它需要一種高級(jí)的抽象策略,以便訂閱者能夠彼此獨(dú)立地發(fā)生改變,而發(fā)行方能夠接受任何有消費(fèi)意向的訂閱者。
推薦度:
標(biāo)簽: 模式 定義 js
  • 熱門(mén)焦點(diǎn)

最新推薦

猜你喜歡

熱門(mén)推薦

專(zhuān)題
Top
主站蜘蛛池模板: 日韩欧美电影在线观看 | 亚洲欧洲精品成人久久曰影片 | 91久久精品国产91性色tv | 在线观看精品一区 | 欧美精品福利 | 欧美日韩国产高清 | 国产欧美日韩va | 四虎免费在线观看视频 | 国产一二三区在线 | 欧美日韩1区 | 最新国产精品视频免费看 | 九九久久香港经典三级精品 | 欧美人与禽zoz0性伦交 | 日韩欧美在线综合网高清 | 国产全部视频在线播放 | 欧美亚洲综合在线 | 91精品国产91久久综合 | 欧美xx在线 | 久久99精品国产99久久 | 欧美另类精品一区二区三区 | 日韩国产一区二区 | 国产精品电影一区二区三区 | 国产精品久久久久久久成人午夜 | 久久无码精品一区二区三区 | 久久精品一区二区 | 亚洲 欧美 91 | 国产精品原创视频 | 成人a毛片免费视频观看 | 国产一区二区三区高清 | 精品国产自在在线在线观看 | 亚洲国产视频网站 | 欧美精品一区二区在线观看 | 亚洲精品在线免费观看 | 国内精品一区二区三区 | 国产在线视频专区 | 久久精品国产亚洲a不卡 | 欧美一区二区三区在线播放 | 日韩免费视频观看 | 精品国产一区二区三区麻豆小说 | 91亚洲国产系列精品第56页 | 欧美色亚洲图 |