javascript 的观察者模式的原理和集线器

学习之前先看一张图.

这张图片很形象的说明了观察者模式的工作原理.其中最左边那台电脑是信号发起者,我们叫它广播者,所有电脑都是信息接受者(包括最左边的广播者).我们称之为监听者.唯一的缺憾是这张图片是并联模式,而我们的观察者模式是串联模式.至于并联和串联,学过初中物理的人就知道,这里不赘述.

下面通过一段js脚本来模拟这个图片的过程,来说明我们这篇文章的主题: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'); } //添加接收信号电脑,使其具有接收信号能力 hub.addListener(computer1)(computer2)(computer3); //由computer1广播名叫receive的信号,说白了就是通知全部有接收信号能力的电脑:我要广播这个函数了,如果你有这个函数请执行它. hub.broadcast(computer1,'receive'); [/javascript]

以上就是一个最简单的观察者模式,这种设计模式在javascript中能发挥非常重要的作用.其中当今比较流行的多模块交互中用的比较多.不明白的读者可以在下面留言,或者提建议.当然也可以批评.