书城计算机大话设计模式
11030400000065

第65章 6 事件监听器也是观察者

大B:“在DOM脚本编程环境中的高级事件模式中,事件监听器说到底就是一种内置的观察者。事件处理器(handler)与事件监听器(listener)并不是一回事。事件处理器说穿了就是一种把事件传给与其关联的函数的手段。而且在这种模型中一种事件只能指定一个回调方法。而在监听器模式中,一个事件可以与几个监听器关联。每个监听器都能独立于其他监听器而改变。”

小A:“师兄,能不能再细说一下?”

大B:“可以,我举个例子,你应该就可以明白了。打个比方,对San Francisco Chronicle这家报社来说,其订阅者Joe订没订New York Times都无所谓。同样,Joe也不在乎Lindsay是否也订了San Francisco Chronnicle。每一方都只管处理自己的数据和相关的行为。”

例如,使用事件监听器,可以让多个函数响应同一个事件:

//example using listeners

Var element=$(‘example’);

Var fn1=function(e){

//handle click

};

Var fn2=function(e){

//do other stuff with click

};

addEvent(element,‘click’,fn1);

addEvent(element,‘click’,fn2);

但用事件处理器就办不到:

//example using handlers

Var elemet=document。getElementById(‘b’);

Var fn1=function(e){

//handle click

};

Var fn2=function(e){

//do other stuff with click

};

element。onclick=fn1;

element。onclick=fn2;

大B:“在第一个例子中,由于使用的是事件监听器,所以click事件发生时fn1和fn2都会被调用。而第二个例子使用的是事件处理器,其中第二次对onclick赋值的结果是fn1被fn2取代,因此click事件发生时只会调用fn2,不会调用fn1.监听器和观察者之间的共同之处显而易见。实际上它们互为同义语。它们都订阅特定的事件,然后等待事件的发生。事件发生时,订阅方的回调函数会得到通知。传给它们的参数是一个事件对象,其中包含着事件发生时间、事件类型和事件发源地等有用的信息。”

小A:“这样我就明白了。”