外观模式:为一组复杂的子系统提供一个更高级的统一接口，通过这个接口可以对子系统访问很轻松。就像我们点的套餐一样，下面详细说明。
1.场景:添加点击事件
为页面document添加onclick事件，
重新添加了，会覆盖。而且存在阻止默认事件的兼容问题。
document.body.onclick=function(e){
e.preventDefault();
console.log(1)
}
2.外观模式来处理
每天中午，我们急冲冲得去餐厅吃饭，人很多，无论是商家还是我们都希望能快点填饱肚子。通常我们都是点套餐，而不点单品，一则省钱，二则省心。套餐简洁明了，他把主食、菜品、饮料都定制好了。外观模式就是如此，他提供一个统一对外接口，这样就能很简单的实现功能而不用管内部的复杂多样。代码如下
addEvent方法实现
var bc = {
addHandler: function(oElement, sEvent, fnHandler) {
oElement.addEventListener ?
oElement.addEventListener(sEvent, fnHandler, false) :
oElement.attachEvent("on" + sEvent, fnHandler)
}
}
原生js有很多兼容代码，我们可以利用外观模式封装一个小型的代码库。(可以用单例模式)
