外观模式概念：
外观模式为子系统中的一组接口提供了一个一致的界面，此模块定义了一个
高层接口，这个接口使得这一子系统更加容易使用。
外观模式不仅简化类中的接口，而且对接口与调用者也进行了解耦。外观模式经常被认为开发者必备，
它可以将一些复杂操作封装起来，并创建一个简单的接口用于调用。
外观模式作用：
1.在设计初期，应该要有意识的将不同的两个层分离，比如经典的三层结构。
2.在开发阶段，子系统往往因为不断的重构演化而变得越来越复杂，增加外观F
可以提供一个简单的接口，减少他们之间的依赖。
3.在维护一个遗留的大型系统，为系统开发一个外观Facade类，为设计粗糙和高度复杂的遗留代码提供比较清晰
的接口，让新系统和Facade对象交互。
注意事项：
1.外观模式被开发者连续使用时会产生一定的性能问题，因为在每次调用时要检测功能的可用性。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var fuhao = {
}
fuhao.huofang = function(){
return '馒头';
}
fuhao.chuliliangshi = function(){
return '面粉';
}
fuhao.mantou = function(){
this.chuliliangshi();
this.huofang();
}
fuhao.men = {
return this.mantou();
}
</script>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var stopEvent = function(e){
e.stopPropagation();
e.preventDefault();
}
//本身就是生产门面
$('#a').click(function(e){
//阻止默认行为
//阻止事件冒泡
stopEvent(e);
});
</script>
</body>
</html>本文学习自常见设计模式视频
原文：https://www.cnblogs.com/smart-girl/p/11535239.html