JavaScript設計模式之適配器模式介紹
適配器模式說明
說明: 適配器模式,一般是為要使用的接口,不符本應用或本系統(tǒng)使用,而需引入的中間適配層類或對象的情況;
場景: 就好比我們買了臺手機,買回來后發(fā)現(xiàn),充電線插頭是三插頭,但家里,只有兩插頭的口的插座,怎么辦?為了方便,也有為能在任何地方都能充上電,就得去買個通用充電適配器; 這樣手機才能在自己家里充上電;不然只能放著,或跑到有這個插頭的地方充電;
實際開發(fā)環(huán)境下,由于舊的系統(tǒng),或第三方應用提供的接口,與我們定義的接口不匹配,在以面向接口編程的環(huán)境下,就無法使用這樣舊的,或第三方的接口,這時我們就使用適配類繼承待適匹配的類,并讓適配類實現(xiàn)接口的方式來引入舊的系統(tǒng)或第三方應用的接口;
這樣使用接口編程時,就可以使用這個適匹配類,來間接調用舊的系統(tǒng)或第三方應用的接口。
在 Javascript 要實現(xiàn)類似動態(tài)面向對象語言的適配器模式的代碼,可以使用到 prototype 的繼承實例來實現(xiàn);因為是基于接口約束的,但是Javascript沒有接口這號東西,我們去掉接口這一層,直接實現(xiàn)接口實現(xiàn)類 Target ,模擬類似的源碼出來;
源碼實例
1. 待適配的類及接口方法:
function Adaptee() {
this.name = 'Adaptee';
}
Adaptee.prototype.getName = function() {
return this.name;
}
2. 普通實現(xiàn)類 [由于 Javascript 中沒有接口,所以就直接提供實現(xiàn)類]
function Target() {
this.name = 'Target';
}
Target.prototype.queryName= function() {
return this.name;
}
3. 適配類:
function Adapte() {
this.name = '';
}
Adapte.prototype = new Adaptee();
Adapte.prototype.queryName = function() {
this.getName();
}
4.使用方法:
var local = new Target();
local.queryName(); //調用普通實現(xiàn)類
var adapte = new Adapte();
adapte.queryName(); //調用舊的系統(tǒng)或第三方應用接口;
其他說明
上面第四步,var local 以及 var adapte 類似像 Java,C# 這樣的面向對象語言中接口引用指定,如:
interface Target {
public String queryName();
}
//接口引用指向
Target local = new RealTarget(); //即上面 Javascript 的 Target 實現(xiàn)類
local.queryName();
//適配器
Target adapte = new Adapte();
adapte.queryName();
可見適配器類是連接接口與目標類接口的中間層;就是用來解決,需要的目標已經存在了,但我們無法直接使用,不能跟我們的代碼定義協(xié)同使用,就得使用適器模式,適配器模式也叫轉換模式,包裝模式;
- JavaScript適配器模式詳解
- javascript設計模式之Adapter模式【適配器模式】實現(xiàn)方法示例
- 深入理解JavaScript系列(39):設計模式之適配器模式詳解
- 詳解JavaScript實現(xiàn)設計模式中的適配器模式的方法
- javascript設計模式 – 適配器模式原理與應用實例分析
- JavaScript設計模式學習之適配器模式
- JavaScript 設計模式之組合模式解析
- JavaScript組合模式學習要點
- 設計模式中的組合模式在JavaScript程序構建中的使用
- javascript設計模式 – 組合模式原理與應用實例分析
- JavaScript設計模式開發(fā)中組合模式的使用教程
- javascript適配器模式和組合模式原理與實現(xiàn)方法詳解
相關文章
詳解TypeScript中的箭頭函數如何實現(xiàn)重載
這篇文章主要為大家詳細介紹了TypeScript中的箭頭函數是如何實現(xiàn)重載的,文中的示例代碼講解詳細,具有一定的參考價值,需要的可以參考一下2023-05-05javascript另類方法實現(xiàn)htmlencode()與htmldecode()函數實例分析
這篇文章主要介紹了javascript另類方法實現(xiàn)htmlencode()與htmldecode()函數,結合實例形式分析了javascript字符編碼與解碼操作的相關技巧,需要的朋友可以參考下2016-11-11微信小程序canvas.drawImage完全顯示圖片問題的解決
這篇文章主要介紹了微信小程序canvas.drawImage完全顯示圖片問題的解決,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-11-11