代理模式
代理模式的中文含义就是帮别人做事，javascript的解释为：把对一个对象的访问, 交给另一个代理对象来操作.
代码实现：
// 补打卡事件
var fillout = function (latedate) {
this.latedate = latedate;
};
// 这是bigboss
var bigboss = function (fillout) {
this.state = function (issuccess) {
console.log("忘记打卡的日期为：" + fillout.latedate + ", 补打卡状态：" + issuccess);
}
};
// 助理代理大boss 完成补打卡审批
var proxyassis = function (fillout) {
this.state = function (issuccess) {
(new bigboss(fillout)).state(issuccess); // 替bigboss审批
}
};
// 调用方法：
var proxyassis = new proxyassis(new fillout("2016-9-11"));
proxyassis.state("补打卡成功");
// 忘记打卡的日期为：2016-9-11, 补打卡状态：补打卡成功
应用场景：
比如图片的懒加载，我们就可以运用这种技术。在图片未加载完成之前，给个loading图片，加载完成后再替换成实体路径。
var myimage = (function(){
var imgnode = document.createelement("img");
document.body.appendchild(imgnode);
return function(src){
imgnode.src = src;
}
})();
// 代理模式
var proxyimage = (function(){
var img = new image();
img.onload = function(){
myimage(this.src);
};
return function(src) {
// 占位图片loading
myimage("http://img.lanrentuku.com/img/allimg/1212/5-121204193q9-50.gif");
img.src = src;
}
})();
// 调用方式
proxyimage("https://img.alicdn.com/tps/i4/tb1b_nelxxxxxcoxfxxc8pz9xxx-130-200.png"); // 真实要展示的图片
当然，这种懒加载方法不用代理模式也是可以实现的，只是用代理模式。我们可以让 myimage 只做一件事，只负责将实际图片加入到页面中，而loading图片交给proxyimage去做。从而降低代码的耦合度。因为当我不想用loading的时候，可以直接调用myimage 方法。也即是说假如我门不需要代理对象的话，直接可以换成本体对象调用该方法即可。
外观模式
外观模式是很常见。其实它就是通过编写一个单独的函数，来简化对一个或多个更大型的，可能更为复杂的函数的访问。也就是说可以视外观模式为一种简化某些内容的手段。
说白了，外观模式就是一个函数，封装了复杂的操作。
代码实现：
比如一个跨浏览器的ajax调用
function ajaxcall(type,url,callback,data){
// 根据当前浏览器获取对ajax连接对象的引用
var xhr=(function(){
try {
// 所有现代浏览器所使用的标准方法
return new xmlhttprequest();
}catch(e){}
// 较老版本的internet explorer兼容
try{
return new activexobject("msxml2.xmlhttp.6.0");
}catch(e){}
try{
return new activexobject("msxml2.xmlhttp.3.0");
}catch(e){}
try{
return new activexobject("microsoft.xmlhttp");
}catch(e){}
// 如果没能找到相关的ajax连接对象，则跑出一个错误。
throw new error("ajax not support in this browser.")
}()),
state_loaded=4,
status_ok=200;
// 一但从服务器收到表示成功的相应消息，则执行所给定的回调方法
xhr.onreadystatechange=function{
if(xhr.readystate !==state_loaded){
return;
}
if(xhr.state==status_ok){
callback(xhr.responsetext);
}
}
// 使用浏览器的ajax连接对象来向所给定的url发出相关的调用
xhr.open(type.touppercase(),url);
xhr.send(data);
}
// 使用方法
ajaxcall("get","/user/12345",function(rs){
alert('收到的数据为：'+rs);
})
应用场景：
当需要通过一个单独的函数或方法来访问一系列的函数或方法调用，以简化代码库的其余内容，使得代码更容易跟踪管理或者更好的维护时，可以使用外观模式。其实我们平时代码中这种模式应该是用的比较多的。
以上就是javascript代理模式、外观模式使用场景和实现代码详解的详细内容。