深入理解JavaScript系列（30）：设计模式之外观模式详解
介绍
外观模式（Facade）为子系统中的一组接口提供了一个一致的界面，此模块定义了一个高层接口，这个接口值得这一子系统更加容易使用。
正文
外观模式不仅简化类中的接口，而且对接口与调用者也进行了解耦。外观模式经常被认为开发者必备，它可以将一些复杂操作封装起来，并创建一个简单的接口用于调用。
外观模式经常被用于JavaScript类库里，通过它封装一些接口用于兼容多浏览器，外观模式可以让我们间接调用子系统，从而避免因直接访问子系统而产生不必要的错误。
外观模式的优势是易于使用，而且本身也比较轻量级。但也有缺点 外观模式被开发者连续使用时会产生一定的性能问题，因为在每次调用时都要检测功能的可用性。
下面是一段未优化过的代码，我们使用了外观模式通过检测浏览器特性的方式来创建一个跨浏览器的使用方法。
var addMyEvent = function (el, ev, fn) {
if (el.addEventListener) {
el.addEventListener(ev, fn, false);
} else if (el.attachEvent) {
el.attachEvent('on' + ev, fn);
} else {
el['on' + ev] = fn;
}
};
再来一个简单的例子，说白了就是用一个接口封装其它的接口：
var mobileEvent = {
// ...
stop: function (e) {
e.preventDefault();
e.stopPropagation();
}
// ...
};
总结
那么何时使用外观模式呢？一般来说分三个阶段：
首先，在设计初期，应该要有意识地将不同的两个层分离，比如经典的三层结构，在数据访问层和业务逻辑层、业务逻辑层和表示层之间建立外观Facade。
其次，在开发阶段，子系统往往因为不断的重构演化而变得越来越复杂，增加外观Facade可以提供一个简单的接口，减少他们之间的依赖。
第三，在维护一个遗留的大型系统时，可能这个系统已经很难维护了，这时候使用外观Facade也是非常合适的，为系系统开发一个外观Facade类，为设计粗糙和高度复杂的遗留代码提供比较清晰的接口，让新系统和Facade对象交互，Facade与遗留代码交互所有的复杂工作。
参考：大话设计模式
-
本文向大家介绍深入理解JavaScript系列（31）：设计模式之代理模式详解，包括了深入理解JavaScript系列（31）：设计模式之代理模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 代理，顾名思义就是帮助别人做事，GoF对代理模式的定义如下： 代理模式（Proxy），为其他对象提供一种代理以控制对这个对象的访问。 代理模式使得代理对象控制具体对象的引用。代理几乎可以是任何对象：文件
-
本文向大家介绍深入理解JavaScript系列（25）：设计模式之单例模式详解，包括了深入理解JavaScript系列（25）：设计模式之单例模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 从本章开始，我们会逐步介绍在JavaScript里使用的各种设计模式实现，在这里我不会过多地介绍模式本身的理论，而只会关注实现。OK，正式开始。 在传统开发工程师眼里，单例就是保证一个类只有一个实例，实
-
本文向大家介绍深入理解JavaScript系列（33）：设计模式之策略模式详解，包括了深入理解JavaScript系列（33）：设计模式之策略模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 策略模式定义了算法家族，分别封装起来，让他们之间可以互相替换，此模式让算法的变化不会影响到使用算法的客户。 正文 在理解策略模式之前，我们先来一个例子，一般情况下，如果我们要做数据合法性验证，很多时候都
-
本文向大家介绍深入理解JavaScript系列（44）：设计模式之桥接模式详解，包括了深入理解JavaScript系列（44）：设计模式之桥接模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 桥接模式（Bridge）将抽象部分与它的实现部分分离，使它们都可以独立地变化。 正文 桥接模式最常用在事件监控上，先看一段代码： 上述代码，有个问题就是getBeerById必须要有浏览器的上下文才能使
-
本文向大家介绍深入理解JavaScript系列（43）：设计模式之状态模式详解，包括了深入理解JavaScript系列（43）：设计模式之状态模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 状态模式（State）允许一个对象在其内部状态改变的时候改变它的行为，对象看起来似乎修改了它的类。 正文 举个例子，就比如我们平时在下载东西，通常就会有好几个状态，比如准备状态（ReadyState）、
-
本文向大家介绍深入理解JavaScript系列（42）：设计模式之原型模式详解，包括了深入理解JavaScript系列（42）：设计模式之原型模式详解的使用技巧和注意事项，需要的朋友参考一下 介绍 原型模式（prototype）是指用原型实例指向创建对象的种类，并且通过拷贝这些原型创建新的对象。 正文 对于原型模式，我们可以利用JavaScript特有的原型继承特性去创建对象的方式，也就是创建的一