class Adapter {
specificRequest() {
return '手機充電接口'
}
}
class Target {
constructor() {
this.adapter = new Adapter()
}
request() {
let info = `${this.adapter.specificRequest()}---通過適配器接入到---充電插頭`
return info
}
}
let target = new Target()
console.info(target.request())

// 手機充電接口---通過適配器接入到---充電插頭

當(dāng)我們有動機地修改一個正常運行的系統(tǒng)的接口，這時應(yīng)該考慮使用適配器模式。

不過，它也有一個要特別注意的缺點，即：過多地使用適配器，會讓系統(tǒng)非常零亂，不易整體進行把握。比如，明明看到調(diào)用的是 A 接口，其實內(nèi)部被適配成了 B 接口的實現(xiàn)，一個系統(tǒng)如果太多出現(xiàn)這種情況，無異于一場災(zāi)難。因此如果不是很有必要，可以不使用適配器，而是直接對系統(tǒng)進行重構(gòu)。

不過，它的好處呢，就是：可以讓任何兩個沒有關(guān)聯(lián)的類一起運行。提高了類的復(fù)用。

// 使用ES6改寫適配器實現(xiàn)地圖SDK統(tǒng)一渲染
class googleMap {
show() {
console.log('開始渲染谷歌地圖');
}
}
class baiduMap {
display() {
console.log('開始渲染百度地圖');
}
}
class baiduMapAdapter extends baiduMap {
constructor() {
super();
}
show() {
this.display();
}
}
// 外部調(diào)用者
function renderMap(map) {
map.show(); // 統(tǒng)一接口調(diào)用
}
renderMap(new googleMap());
renderMap(new baiduMapAdapter());

// 開始渲染谷歌地圖
// 開始渲染百度地圖

到此這篇關(guān)于理解JavaScript中的適配器模式Adapter Pattern的文章就介紹到這了,更多相關(guān)JS適配器模式內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: