每个web应用一般都有相当多的事件处理程序,监听着无数不同的事件。然而,很少有能仔细得将应用逻辑从事件处理程序中分离的。请看一下例子:
function handleKeyPress(event){
event = event || winow.event;
if(event.keyCode == 13){
var target = event.target || event.srcElement;
var value = 5 * target.value;
if(value > 10){
document.getElementById('erro-msg').style.display = 'block';
}
}
}
这个事件处理程序除了包含了应用逻辑,还进行了事件的处理。这种方式的问题有其双重性。首先,除了通过事件之外就再没有方法执行应用逻辑了,这让调用变得困难。如果没有发生预想的结果怎么办?是不是表示时间处理程序没有被调用还是指应用逻辑失败?其次,如果一个后续的时间引发同样的应用逻辑,那就必须复制功能代码或者将代码抽取到一个单独的函数中。无论何种方式,都要作比实际所需更多的额改动。
较好的方法是将应用逻辑和事件处理程序相分离,这样两者分别处理各自的东西。一个事件处理程序应该从事件对象中提取到相关信息,并将这写信息传送到处理应用逻辑的某个方法中。例如,前面的代码可以被重写为:
function validateValue(value){
value = 5 * value;
if(value > 10){
document.getElementById('erro-msg').style.display = 'block';
}
}
function handlerKeyPress(event){
event = event || window.event;
if(event.keyCode == 13){
var target = event.target || event.secElement;
validateValue(target.value);
}
}
从 事件处理程序中分离应用逻辑有几个好处。首先,可以让你更容易更改触发特定过程的事件。如果最开始由鼠标点击时事件触发过程,但现在按键也要进行同样的处理,这种更改就很容易。其次,可以在不附加到事件的情况下测试代码,使其更易创建单元测试或者是自动化应用流程。
一下是要牢记的应用和业务逻辑之间的松散耦合的几条原则:
1、勿将event对象传给其他方法;只传来自event对象中所需的数据。
2、任何可以在应用层面的动作都应该可以在执行任何事件处理程序的情况下进行;
3、任何事件处理程序都应该处理事件,然后将处理转交给应用逻辑。