適配器模式的作用是解決兩個(gè)軟件實(shí)體間的接口不兼容的問題,在JavaScript尤其是AJAX方面比較常用,接下來看一下對Adapter適配器模式在JavaScript設(shè)計(jì)模式編程中的運(yùn)用分析

定義

適配器模式（Adapter）是將一個(gè)類（對象）的接口（方法或?qū)傩裕┺D(zhuǎn)化成客戶希望的另外一個(gè)接口（方法或?qū)傩裕?，適配器模式使得原本由于接口不兼容而不能一起工作的那些類（對象）可以一些工作。速成包裝器（wrapper）。

適配器的別名是包裝器（wrapper），這是一個(gè)相對簡單的模式。在程序開發(fā)中有許多這樣的場景：當(dāng)我們試圖調(diào)用模塊或者對象的某個(gè)接口時(shí)，卻發(fā)現(xiàn)這個(gè)接口的格式并不符合目前的需求。這時(shí)候有兩種解決辦法，第一種是修改原來的接口實(shí)現(xiàn)，但如果原來的模塊很復(fù)雜，或者我們拿到的模塊是一段別人編寫的經(jīng)過壓縮的代碼，修改原接口就顯得不太現(xiàn)實(shí)了。第二種辦法是創(chuàng)建一個(gè)適配器，將原接口轉(zhuǎn)換為客戶希望的另一個(gè)接口，客戶只需要和適配器打交道。

為什么需要采用適配器模式？

在開發(fā)應(yīng)用程序時(shí)，您往往會(huì)需要更換其中某一部分，例如，您用于保存日志或類似性質(zhì)的內(nèi)容的一個(gè)庫。 當(dāng)您用一個(gè)新庫來替換它時(shí)，新庫不太可能有完全相同的接口。 從這里開始，您有兩種選擇：

（1）檢查所有代碼，并更改指向舊庫的一切代碼。

（2）創(chuàng)建一個(gè)適配器，使新庫可以使用與舊庫相同的接口。

顯然，在一些情況下，假如您的應(yīng)用程序很小，或者對舊庫的引用很少，更合適的做法是檢查完整的代碼，并更改它以匹配新庫，而不是添加一個(gè)新的抽象層，使代碼更復(fù)雜。 但是，在大多數(shù)情況下，創(chuàng)建一個(gè)適配器更為實(shí)用且節(jié)省時(shí)間。

JavaScript代碼示例

一件事情有可能發(fā)生時(shí)，它就一定會(huì)發(fā)生。首先讓我們來看一下這個(gè)小小的LoggerFactory，它讓我們能更容易地修改我們使用的日志接口。

var LoggerFactory = {

  getLogger: function() {

    return window.console;

  },

  ...

};

/* 用法示例 */

var logger = LoggerFactory.getLogger();

logger.log("something to log");

在我們調(diào)用getLogger時(shí)它給我們返回了控制臺(tái)對象(console)。為了這個(gè)練習(xí)我們假裝console對象只有一個(gè)方法——log，并且它只能接收一個(gè)字符串類型的參數(shù)。 接下來，我們有另一個(gè)日志接口，這個(gè)會(huì)復(fù)雜些，因?yàn)?）它是用JavaScript實(shí)現(xiàn)的，不像console那樣是瀏覽器本身就有的；2）它會(huì)把日志通過AJAX發(fā)送到服務(wù)器，這也意味著我們要對URL數(shù)據(jù)進(jìn)行編碼（代碼里不會(huì)具體實(shí)現(xiàn)URL編碼相關(guān)的事，因?yàn)樗臀覀兊囊v的適配器模式毫不相干）。當(dāng)然，它會(huì)使用一個(gè)和控制臺(tái)不同的接口。

var AjaxLogger = {

  sendLog: function() {

    var data = this.urlEncode(arguments);

    jQuery.ajax({

      url: "http://example.com/log",

      data: data

    });

  },

  urlEncode: function(arg) {

    ...

    return encodedData;

  },

  ...

};

我們使用了jQuery的AJAX請求，主要是為了節(jié)省時(shí)間，忽略那些和適配器模式不想干的事情。 我們現(xiàn)在要做的事情就是創(chuàng)建一個(gè)適配器，并且改變之前的LoggerFactory讓其返回這個(gè)適配器而不是控制臺(tái)對象。

var AjaxLoggerAdapter = {

  log: function(arg) {

    AjaxLogger.sendLog(arg);

  }

};

/* 調(diào)整 LoggerFactory */

var LoggerFactory = {

  getLogger: function() {

    // 改變返回值

    return AjaxLoggerAdapter;

  },

  ...

};

我們對現(xiàn)有代碼只做了一行更改，整個(gè)程序就可以使用這個(gè)新的日志接口了。

復(fù)雜適配器

日志接口是個(gè)很簡單的例子，它只有一個(gè)方法，把它直接映射到舊的方法上也沒什么難的。大多數(shù)情況下并不是如此。你可能會(huì)碰到這樣的問題，即這些互相映射的函數(shù)的參數(shù)是完全不同的，舊接口可能根本沒有這些參數(shù)，你必須自己處理它們。某些情況下，你又必須刪掉一些參數(shù)，因?yàn)樾碌慕涌诟居貌簧纤鼈?。如果兩個(gè)對象之間的接口映射太難，我們就要想想別的辦法了，反正我不希望查找和修改數(shù)千行舊代碼。