什么是代理模式
代理模式是為一個對象提供一個代用品或占位符,以便控制對它的訪問。
(可以想象一下明星與經(jīng)紀人的關系,明星是請求的本體,經(jīng)紀人就是代理proxy)
如何實現(xiàn)代理模式
代理對象內(nèi)部含有對本體對象的引用,因而可以與調用本體的相關方法;同時,代理對象提供與本體對象相同的接口,方便在任何時刻代理本體對象。
例子(上代碼)
代理模式的變體有很多,有:保護代理、虛擬代理、緩存代理、防火墻代理、遠程代理、智能引用代理、寫時復制代理。具體介紹前三種。
(1)保護代理
保護代理主要用于控制不同權限的對象對本體對象的訪問權限。比如很多人想訪問本體A,如果有代理B存在的話,B會首先剔除不滿足A的訪問條件的訪問者,符合條件的才能訪問。
作用:過濾請求
例如:權限的劃分和管理就是使用保護代理proxy來完成的。
注冊普通用戶:code為“001”
論壇管理者 :code為“002”
系統(tǒng)管理者 :code為“003”
游 客 :code為“000”
論壇開放了四個基礎功能
1,發(fā)帖
2,帖子審核
3,清除帖子
4,留言
游客不具備任何操作權限,注冊用戶只能發(fā)帖,論壇管理者可以審核以及刪帖操作,系統(tǒng)管理者具有所有功能權限。
-
-
function User(name,code){
-
this.name = name ;
-
this.code = code ;
-
} ;
-
User.prototype = {
-
getName : function(){
-
return this.name ;
-
} ,
-
getCode : function(){
-
return this.code ;
-
} ,
-
post : function(){
-
console.log("發(fā)帖子!") ;
-
} ,
-
remove : function(){
-
console.log("刪除帖子!") ;
-
} ,
-
check : function(){
-
console.log("審核帖子!") ;
-
} ,
-
comment : function(){
-
console.log("回復帖子!") ;
-
}
-
} ;
-
-
function Forum(user){
-
this.user = user ;
-
} ;
-
Forum.prototype = {
-
getUser : function(){
-
return this.user ;
-
} ,
-
post : function(){
-
if(this.user.getCode() == "001" || this.user.getCode() == "003"){
-
return this.user.post() ;
-
}
-
console.log("沒權限發(fā)帖子!") ;
-
} ,
-
remove : function(){
-
if(this.user.getCode() == "002" || this.user.getCode() == "003"){
-
return this.user.remove() ;
-
}
-
console.log("沒權限刪除帖子!") ;
-
} ,
-
check : function(){
-
if(this.user.getCode() == "002" || this.user.getCode() == "003"){
-
return this.user.check() ;
-
}
-
console.log("沒權限審核帖子!") ;
-
} ,
-
comment : function(){
-
if(this.user.getCode() == "003"){
-
return this.user.comment() ;
-
}
-
console.log("沒權限回復帖子!") ;
-
}
-
} ;
-
-
function ForumClient(){
-
this.run = function(){
-
new Forum(new User("bigbear","003")).check() ;
-
}
-
} ;
在該例子中,論壇代理有與user本體相同的接口,可以在滿足條件時,執(zhí)行與本體相同的代碼,與調用方法的人而言,是不透明的,我實現(xiàn)了調用,但不在乎是通過代理實現(xiàn)的,還是本體實現(xiàn)的。
本案例來源:大熊君大話設計模式JavaScript
(2)虛擬代理
虛擬代理是將調用本體方法的請求進行管理,等到本體適合執(zhí)行時,再執(zhí)行。
作用:將開銷很大的對象,延遲到真正需要它的時候再執(zhí)行。
比如:利用虛擬代理實現(xiàn)圖片預加載功能:
-
-
var myImage = (function(){
-
var imageNode = document.createElement('img');
-
document.body.appendChild(imageNode);
-
-
return {
-
setSrc: function(src){
-
imageNode.src = src;
-
}
-
}
-
})()
-
-
-
var proxyImage = (function(){
-
var img = new Image();
-
img.onload = function(){
-
myImage.setSrc(this.src);
-
}
-
-
return {
-
setSrc: function(src){
-
myImage.setSrc('本地的圖片地址');
-
img.src = src;
-
}
-
}
-
})()
比如:利用虛擬代理合并HTTP請求
-
-
-
-
var synchronousFile = function(id){
-
console.log('開始同步上傳文件,id為:'+id);
-
}
-
-
-
var proxySynchronousFile = (function(){
-
var cache = [],
-
timer;
-
-
return function(id){
-
cache.push(id);
-
if(timer){
-
return;
-
}
-
timer = setTimeout(function(){
-
synchronousFile(cache.join(','));
-
clearTimeout(timer);
-
timer = null;
-
cache.length = 0;
-
},2000)
-
}
-
})()
-
-
var checkbox = document.getElementsByTagName('input');
-
-
for(var i=0,c;c=checkbox[i++];){
-
c.onclick = function(){
-
if(this.check === true){
-
proxySynchronousFile(this.id);
-
}
-
}
-
}
在這些例子中,虛擬代理對請求進行擱置處理,等到合適的時機,對本體的接口進行調用,可以有效提升Web性能。
(3)緩存代理
緩存代理可以為開銷大的一些運算結果提供暫時性的存儲,如果再次傳進相同的參數(shù)是,直接返回結果,避免大量重復計算。
-
-
-
var mult = function(){
-
var a = 1;
-
for(var i=0;i<arguments.length;i++){
-
a = a*arguments[i];
-
}
-
return a;
-
}
-
var plus = function(){
-
var a = 0;
-
for(var i=0; i<arguments.length; i++){
-
a = a + arguments[i];
-
}
-
return a;
-
}
-
-
var proxyFactory = function(fn) {
-
var cache = {};
-
return function(){
-
var args = Array.prototype.join.call(arguments,',');
-
if(args in cache){
-
return cache[args];
-
}
-
-
return cache[args] = fn.apply(this,arguments);
-
}
-
}
-
-
-
var proxyMult = proxyFactory(mult),
-
proxyPlus = proxyFactory(plus);
-
-
console.log(proxyMult(1,2,3,4));
-
console.log(proxyMult(1,2,3,4));
-
console.log(proxyPlus(5,6,7,8));
-
console.log(proxyPlus(5,6,7,8));
什么情況下使用代理
當我們需要使用的對象很復雜或者需要很長時間去構造,這時就可以使用代理模式(Proxy)。例如:如果構建一個對象很耗費時間和計算機資源,代理模式(Proxy)允許我們控制這種情況,直到我們需要使用實際的對象。一個代理(Proxy)通常包含和將要使用的對象同樣的方法,一旦開始使用這個對象,這些方法將通過代理(Proxy)傳遞給實際的對象。
比如上面的代碼:需要花很長的時間加載很多圖片,復雜的運算過程,頻繁的多次請求處理等;都可以用到代理模式。
小結
代理模式的一個好處就是對外部提供統(tǒng)一的接口方法,而代理類在接口中實現(xiàn)對真實類的附加操作行為,從而可以在不影響外部調用情況下,進行系統(tǒng)擴展。也就是說,我要修改真實角色的操作的時候,盡量不要修改他,而是在外部在“包”一層進行附加行為,即代理類。
藍藍設計( bouu.cn )是一家專注而深入的界面設計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務