詳解JavaScript實(shí)現(xiàn)設(shè)計(jì)模式中的適配器模式的方法
來(lái)源:易賢網(wǎng) 閱讀:669 次 日期:2016-06-27 14:22:37
溫馨提示:易賢網(wǎng)小編為您整理了“詳解JavaScript實(shí)現(xiàn)設(shè)計(jì)模式中的適配器模式的方法”,方便廣大網(wǎng)友查閱!

適配器模式可以根據(jù)需求轉(zhuǎn)換(或調(diào)整)一個(gè)接口,創(chuàng)建含有您所需接口的另一個(gè)對(duì)象,并將它連接到您想改變接口的對(duì)象,從而完成這種轉(zhuǎn)換,下面就來(lái)詳解JavaScript實(shí)現(xiàn)設(shè)計(jì)模式中的適配器模式的方法

有的時(shí)候在開(kāi)發(fā)過(guò)程中,我們會(huì)發(fā)現(xiàn),客戶端需要的接口和提供的接口發(fā)生不兼容的問(wèn)題。由于特殊的原因我們無(wú)法修改客戶端接口。在這種情況下,我們需要適配現(xiàn)有接口和不兼容的類,這就要提到適配器模式。通過(guò)適配器,我們可以在不用修改舊代碼的情況下也能使用它們,這就是適配器的能力。

適配模式可用來(lái)在現(xiàn)有接口和不兼容的類之間進(jìn)行適配,使用這種模式的對(duì)象又叫包裝器(wrapper),因?yàn)樗鼈兪窃谟靡粋€(gè)新的接口包裝另一個(gè)對(duì)象。

從表面上看,適配器模式很像外觀模式。它們都要對(duì)別的對(duì)象進(jìn)行包裝并改變其呈現(xiàn)的接口。二者的差別在于它們?nèi)绾胃淖兘涌凇M庥^元素展現(xiàn)的是一個(gè)簡(jiǎn)化的接口,它并不提供額外的選擇,而且有時(shí)為了方便完成常見(jiàn)任務(wù)它還會(huì)做出一些假定。而適配器則要把一個(gè)接口轉(zhuǎn)換為另一個(gè)接口,它并不會(huì)濾除某些能力,也不會(huì)簡(jiǎn)化接口。如果客戶系統(tǒng)API不可用,就需要用到適配器。

基本理論

適配器模式:將一個(gè)接口轉(zhuǎn)換成客戶端需要的接口而不需要去修改客戶端代碼,使得不兼容的代碼可以一起工作。

適配器主要有3個(gè)角色組成:

(1)客戶端:調(diào)用接口的類

(2)適配器:用來(lái)連接客戶端接口和提供服務(wù)的接口的類

(3)適配者:提供服務(wù),但是卻與客戶端接口需求不兼容服務(wù)類。

適配器模式的實(shí)現(xiàn)

1.最簡(jiǎn)單的適配器

適配器模式?jīng)]有想象中的那么復(fù)雜,舉個(gè)最簡(jiǎn)單的例子。

客戶端調(diào)用一個(gè)方法進(jìn)行加法計(jì)算:

var result = add(1,2);

但是我們沒(méi)有提供add這個(gè)方法,提供了同樣類似功能的sum方法:

function sum(v1,v2){

  return v1 + v2;

}

為了避免修改客戶端和服務(wù)端,我們?cè)黾右粋€(gè)包裝函數(shù):

function add (v1,v2){

  reutrn sum(v1,v2);

}

這就是一個(gè)最簡(jiǎn)單的適配器模式,我們?cè)趦蓚€(gè)不兼容的接口之間添加一個(gè)包裝方法,用這個(gè)方法來(lái)連接二者使其共同工作。

2.實(shí)際應(yīng)用

隨著前端框架的發(fā)展,越來(lái)越多的開(kāi)發(fā)者開(kāi)始使用MVVM框架進(jìn)行開(kāi)發(fā),只需要操作數(shù)據(jù)而不需要操作DOM元素,jQuery的作用越來(lái)越少。而很多項(xiàng)目中還是引用著jQuery庫(kù)作用工具類,因?yàn)槲覀円胘Query提供的ajax去服務(wù)器請(qǐng)求數(shù)據(jù)。如果jQuery在項(xiàng)目中的作用僅僅是作為ajax工具庫(kù)的話,有點(diǎn)殺雞焉用牛刀的感覺(jué),造成資源浪費(fèi)。這個(gè)時(shí)候我們完全可以封裝一個(gè)自己的ajax庫(kù)。

假設(shè)我們封裝的ajax就通過(guò)一個(gè)函數(shù)進(jìn)行使用:

ajax({

  url:'/getData',

  type:'Post',

  dataType:'json',

  data:{

    id:"123"

  }

})

.done(function(){})

除了調(diào)用接口ajax與jQuery的$.ajax的不同,其他完全一樣。

項(xiàng)目中請(qǐng)求ajax的地方必然很多,我們替換jQuery的時(shí)候不可能一個(gè)一個(gè)去修改$.ajax,那怎么辦呢,這個(gè)時(shí)候,我們就可以增加一個(gè)適配器:

var $ = {

  ajax:function (options){

    return ajax(options);

  }

}

這樣就能兼容舊代碼和新接口,避免對(duì)已有的代碼的修改。

總結(jié)

適配器模式的原理很簡(jiǎn)單,就是新增一個(gè)包裝類,對(duì)新的接口進(jìn)行包裝以適應(yīng)舊代碼的調(diào)用,避免修改接口和調(diào)用代碼。

適用場(chǎng)景:存在較多代碼調(diào)用舊接口,為了避免修改舊代碼和更換新接口,不影響現(xiàn)有實(shí)現(xiàn)方式的應(yīng)用場(chǎng)景。

1.適配器模式的適用場(chǎng)合:

適配器適用于客戶系統(tǒng)期待的接口與現(xiàn)有API提供的接口不兼容這種場(chǎng)合。適配器所適配的兩個(gè)方法執(zhí)行的應(yīng)該是類似的任務(wù),否則的話就解決不了問(wèn)題。就像橋接元素和外觀元素一樣,通過(guò)創(chuàng)建適配器,可以把抽象與其實(shí)現(xiàn)隔離開(kāi)來(lái),以便二者獨(dú)立變化。

2.適配器模式之利:

用一個(gè)新的接口對(duì)現(xiàn)有類的接口進(jìn)行包裝,這樣客戶程序就能使用這個(gè)并非為其量身打造的類而又無(wú)需為此大動(dòng)手術(shù)。

3.設(shè)配器模式之弊:

有人認(rèn)為適配器是一種不必要的開(kāi)銷,完全可以通過(guò)重寫現(xiàn)有代碼避免。此外適配器模式也會(huì)引入一批需要支持的新工具。如果現(xiàn)有API還未定形,或者新接口還未定形,那么適配器可能不會(huì)一直管用。

在涉及大型系統(tǒng)和遺留框架的情況下,它的優(yōu)點(diǎn)往往比缺點(diǎn)更突出。

更多信息請(qǐng)查看網(wǎng)絡(luò)編程
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!

2025國(guó)考·省考課程試聽(tīng)報(bào)名

  • 報(bào)班類型
  • 姓名
  • 手機(jī)號(hào)
  • 驗(yàn)證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 新媒體/短視頻平臺(tái) | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號(hào):hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專用圖標(biāo)