本篇文章帶給大家的內容是關於js設計模式:什麼是代理模式 ? js代理模式的介紹,有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。
情境:小明追女生A
非代理模式:小明=花=> 女生A
代理模式:小明=花=> 讓女生A的好友B幫忙=花=> 女生A
#定義:為其他對象提供一種代理以控制對這個對象的訪問。
主要解決:直接存取物件時帶來的問題,比如說:要存取的物件在遠端的機器上。在物件導向系統中,有些物件因為某些原因(例如物件建立開銷很大,或是某些操作需要安全控制,或需要進程外的存取),直接存取會為使用者或系統結構帶來很多麻煩,我們可以在存取此物件時加上一個對此物件的存取層。
何時使用:想在存取一個物件時做一些控制。
如何解決:增加中間層。
應用程式實例: 1、Windows 裡面的捷徑。 2、豬八戒去找高翠蘭結果是孫悟空變的,可以這樣理解:把高翠蘭的外貌抽像出來,高翠蘭本人和孫悟空都實現了這個接口,豬八戒訪問高翠蘭的時候看不出來這個是孫悟空,所以說孫悟空是高翠蘭代理類。 3.買火車票不一定在火車站買,也可以去代售點。 4.一張支票或銀行存單是帳戶中資金的代理。支票在市場交易中用來代替現金,並提供對簽發人帳號上資金的控制。 5、spring aop。
優點: 1、職責清晰。 2、高擴展性。 3、智能化。
缺點: 1、由於在客戶端和真實主體之間增加了代理對象,因此有些類型的代理模式可能會造成請求的處理速度變慢。 2.實作代理模式需要額外的工作,有些代理模式的實作非常複雜。
使用場景:按職責來劃分,通常有以下使用場景: 1、遠端代理。 2、虛擬代理。 3、Copy-on-Write 代理。 4、保護(Protect or Access)代理程式。 5.Cache代理。 6、防火牆(Firewall)代理。 7.同步化(Synchronization)代理程式。 8.智能引用(Smart Reference)代理。
注意事項: 1、和適配器模式的差異:適配器模式主要改變所考慮物件的接口,而代理模式不能改變所代理類別的介面。 2、和裝飾器模式的區別:裝飾器模式為了增強功能,而代理模式是為了加以控制。
代理模式的種類很多,在 JS 中最常用的為虛擬代理和快取代理。
下面這段程式碼運用代理模式來實現圖片預加載,可以看到透過代理模式巧妙地將創建圖片與預加載邏輯分離,並且在未來如果不需要預先載入,只要改成請求本體取代請求代理物件就行。
const myImage = (function() { const imgNode = document.createElement('img') document.body.appendChild(imgNode) return { setSrc: function(src) { imgNode.src = src } } })() const proxyImage = (function() { const img = new Image() img.onload = function() { // http 图片加载完毕后才会执行 myImage.setSrc(this.src) } return { setSrc: function(src) { myImage.setSrc('loading.jpg') // 本地 loading 图片 img.src = src } } })() proxyImage.setSrc('http://loaded.jpg')
快取代理實現乘積計算
const mult = function() { let a = 1 for (let i = 0, l; l = arguments[i++];) { a = a * l } return a } const proxyMult = (function() { const cache = {} return function() { const tag = Array.prototype.join.call(arguments, ',') if (cache[tag]) { return cache[tag] } cache[tag] = mult.apply(this, arguments) return cache[tag] } })() proxyMult(1, 2, 3, 4) // 24
建議:在開發時候不要先去猜測是否需要使用代理模式,如果發現直接使用某個物件不方便時,再來優化不遲。
相關推薦:
以上是js設計模式:什麼是代理模式 ? js代理模式的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!