JavaScript学习笔记(四十六) 门面

门面(Façade)

门面是一种简单的模式；它仅仅是给对象提供可选的接口。它是一种很好实践，让你的代码简短且不会处理太多的事情。遵循这个实践，你最终将获得比使用带有很多参数的超级方法(uber methods)更多的方法。有时2个或更多方法可能通常一起被调用。在这种情况下，额外创建一个方法包裹重复的调用时有意义的。

比如，当处理浏览器事件时，你有下面的方法：

stopPropagation()  限制事件且不让它往上冒泡到父节点

preventDefault() 不让浏览器做默认的动作(比如：访问一个连接或者提交一个表单)

这两个不同的方法有不同的目的，它们应该被分开，但同时，它们经常一起被调用。因此为了取代在整个程序中的两个方法的重复调用，你可以创建一个门面方法调用这两个方法：

var myevent = {
    // ...
    stop: function(e) {
        e.preventDefault();
        e.stopPropagation();
    }
    // ...
};

门面模式也适合浏览器脚本，浏览器间不同的部分可以隐藏在一个门面后面。接着前面的例子，你可以添加处理IE事件不同之处的代码：

var myevent = {
    // ...
    stop: function(e) {
        // others
        if (typeof e.preventDefault === "function") {
            e.preventDefault();
        }
        if (typeof e.stopPropagation === "function") {
            e.stopPropagation();
        }
        // IE
        if (typeof e.returnValue === "boolean") {
            e.returnValue = false;
        }
        if (typeof e.cancelBubble === "boolean") {
            e.cancelBubble = true;
        }
    }
    // ...
};

门面模式对重新设计和重构也是有帮助的。当你想用一个不同的实现替换一个对象时，你不得不在一段时间内完成(它是一个复杂的对象)，在使用这个对象的新代码被编写的同时。你可以先开始考虑新对象的API然后在旧对象之上创建一个遵循新API的门面。这种方法，当你开始完全替换旧对象，你只有很少的代码需要修改因为最近的任何代码已经使用的是新API。