學(xué)習(xí)之前先看一張圖.

這張圖片很形象的說(shuō)明了觀察者模式的工作原理.其中最左邊那臺(tái)電腦是信號(hào)發(fā)起者,我們叫它廣播者,所有電腦都是信息接受者(包括最左邊的廣播者).我們稱之為監(jiān)聽(tīng)者.唯一的缺憾是這張圖片是并聯(lián)模式,而我們的觀察者模式是串聯(lián)模式.至于并聯(lián)和串聯(lián),學(xué)過(guò)初中物理的人就知道,這里不贅述.

下面通過(guò)一段js腳本來(lái)模擬這個(gè)圖片的過(guò)程,來(lái)說(shuō)明我們這篇文章的主題:javascript 的觀察者模式

[javascript] var hub = { listeners : [], addListener : function(listener){ hub.listeners.push(listener); return hub.addListener; }, broadcast : function(broadcaster,method){ for(i=0;i<hub.listeners.length;i++){ if(broadcaster===hub.listeners[i]){ console.log(broadcaster+'is broadcaster'); } if(hub.listeners[i][method]) hub.listeners[i][method](); } } } var computer1 = {}, computer2 = {}, computer3 = {}; computer1.receive = function(){ console.log('computer1 receive the signal!111'); } computer2.receive = function(){ console.log('computer2 receive the signal!222'); } computer3.receive = function(){ console.log('computer3 receive the signal!333'); } //添加接收信號(hào)電腦,使其具有接收信號(hào)能力 hub.addListener(computer1)(computer2)(computer3); //由computer1廣播名叫receive的信號(hào),說(shuō)白了就是通知全部有接收信號(hào)能力的電腦:我要廣播這個(gè)函數(shù)了,如果你有這個(gè)函數(shù)請(qǐng)執(zhí)行它. hub.broadcast(computer1,'receive'); [/javascript]

以上就是一個(gè)最簡(jiǎn)單的觀察者模式,這種設(shè)計(jì)模式在javascript中能發(fā)揮非常重要的作用.其中當(dāng)今比較流行的多模塊交互中用的比較多.不明白的讀者可以在下面留言,或者提建議.當(dāng)然也可以批評(píng).

轉(zhuǎn)載于:https://www.cnblogs.com/7hihi/archive/2010/08/15/2564196.html

總結(jié)

以上是生活随笔為你收集整理的javascript 的观察者模式的原理和集线器的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。