適配器模式是設(shè)計(jì)模式行為型模式中的一種模式涣旨；
定義：
適配器用來(lái)解決兩個(gè)已有接口之間不匹配的問(wèn)題，它并不需要考慮接口是如何實(shí)現(xiàn)股冗，也不用考慮將來(lái)該如何修改霹陡；適配器不需要修改已有接口，就可以使他們協(xié)同工作止状；
白話解釋：
你買了某種電器產(chǎn)品烹棉，準(zhǔn)備帶回家好好感受該款產(chǎn)品的魅力；結(jié)果帶回家之后準(zhǔn)備通電使用的時(shí)候导俘，發(fā)現(xiàn)該產(chǎn)品僅支持兩孔插座峦耘，而你家里的電源插座都是三孔插座；這個(gè)時(shí)候你總不能又跑去電器專賣店退貨吧旅薄；突然靈機(jī)一動(dòng)辅髓，你想起來(lái)了家里還有多功能電源插座，而多功能店員插座恰好就是三孔少梁，于是你拿出你的多功能電源插座插上電源插座洛口，再拿你電器產(chǎn)品的電源插座插在多功能插座上面的兩孔插座上，開(kāi)始享受美滋滋的生活凯沪；這里的多功能插座就是一個(gè)適配器第焰；
代碼實(shí)現(xiàn)：
var googleMap = {
show: function(){
console.log( '開(kāi)始渲染谷歌地圖' );
}
};
var baiduMap = {
show: function(){
console.log( '開(kāi)始渲染百度地圖' );
}
};
var renderMap = function( map ){
if ( map.show instanceof Function ){
map.show();
}
};
renderMap( googleMap ); // 開(kāi)始渲染谷歌地圖
renderMap( baiduMap ); // 開(kāi)始渲染百度地圖
當(dāng)然上面的代碼是能夠正常運(yùn)行的，這得益于這兩個(gè)對(duì)象中的參數(shù)名都是一樣的妨马，所以才能夠正常的運(yùn)行和顯示挺举；
var googleMap = {
show: function(){
console.log( '開(kāi)始渲染谷歌地圖' );
}
};
var baiduMap = {
display: function(){
console.log( '開(kāi)始渲染百度地圖' );
}
};
突然有一天如果baiduMap的方法名改變了呢杀赢？那么我們?cè)俑厦嬉粯舆\(yùn)行肯定是回會(huì)報(bào)錯(cuò)的，因?yàn)閎aiduMap對(duì)象中已經(jīng)沒(méi)有了show()這個(gè)方法了湘纵；
使用適配器模式來(lái)修改：
var googleMap = {
show: function(){
console.log( '開(kāi)始渲染谷歌地圖' );
}
};
var baiduMap = {
display: function(){
console.log( '開(kāi)始渲染百度地圖' );
}
};
var baiduMapAdapter = {
show: function(){
return baiduMap.display();
}
};
renderMap( googleMap ); // 輸出：開(kāi)始渲染谷歌地圖
renderMap( baiduMapAdapter ); // 輸出：開(kāi)始渲染百度地圖
在這段代碼中適配器做的事情其實(shí)很簡(jiǎn)單脂崔，就是創(chuàng)建了一個(gè)對(duì)象，添加了一個(gè)同名的show()方法梧喷，然后在適配器里面調(diào)用了baiduMap.display()方法砌左，這樣我們只需要在調(diào)用baiduMap的時(shí)候調(diào)用我們的適配器即可達(dá)到預(yù)期效果；
我們作為前端開(kāi)發(fā)人員铺敌，對(duì)頁(yè)面上期待得到的數(shù)據(jù)和數(shù)據(jù)格式肯定是比較了解的汇歹，但是在前后端分離的開(kāi)發(fā)模式中有的時(shí)候會(huì)遇到這種尷尬的處境：
我們都知道很多UI組件或者工具庫(kù)會(huì)按指定的數(shù)據(jù)格式進(jìn)行渲染，但是這個(gè)時(shí)候后端是不知道的偿凭；所以可能接口出來(lái)的數(shù)據(jù)我們是不能直接正常的在頁(yè)面上渲染的产弹，而此時(shí)老板催促我們趕緊上線，而后端堅(jiān)持認(rèn)為數(shù)據(jù)格式?jīng)]問(wèn)題弯囊，堅(jiān)決不修改取视；這個(gè)時(shí)候我們可以通過(guò)適配器模式來(lái)前端格式化數(shù)據(jù)；
后端返回的json數(shù)據(jù)格式：
[
{
"day": "周一",
"uv": 6300
},
{
"day": "周二",
"uv": 7100
}, {
"day": "周三",
"uv": 4300
}, {
"day": "周四",
"uv": 3300
}, {
"day": "周五",
"uv": 8300
}, {
"day": "周六",
"uv": 9300
}, {
"day": "周日",
"uv": 11300
}
]
Echarts圖表圖形需要的數(shù)據(jù)格式：
["周二", "周二", "周三"常挚， "周四"， "周五"稽物， "周六"奄毡， "周日"] //x軸的數(shù)據(jù)
[6300. 7100, 4300, 3300, 8300, 9300, 11300] //坐標(biāo)點(diǎn)的數(shù)據(jù)
雖然心里苦，但還是要解決問(wèn)題贝或！使用適配器來(lái)解決：
//x軸適配器
function echartXAxisAdapter(res) {
return res.map(item => item.day);
}
//坐標(biāo)點(diǎn)適配器
function echartDataAdapter(res) {
return res.map(item => item.uv);
}
創(chuàng)建兩個(gè)函數(shù)分別對(duì)數(shù)據(jù)按照echarts所需要的數(shù)據(jù)格式進(jìn)行格式化處理即可解決問(wèn)題吼过；這兩個(gè)方法其實(shí)就是一個(gè)適配器，把指定的數(shù)據(jù)丟進(jìn)去即可按照指定規(guī)則輸出我們期待得到的數(shù)據(jù)格式咪奖；
總結(jié)：
個(gè)人認(rèn)為適配器模式其實(shí)是一種亡羊補(bǔ)牢式的設(shè)計(jì)模式盗忱，如果在項(xiàng)目開(kāi)發(fā)的開(kāi)始階段我們就知道我們期待的數(shù)據(jù)格式或者方法名等，我們就可能永遠(yuǎn)都用不到適配器模式羊赵；但是項(xiàng)目的迭代往往是不可預(yù)期的趟佃，當(dāng)項(xiàng)目迭代之后數(shù)據(jù)格式或者方法名發(fā)生變化之后，我們通趁两荩可以使用適配器模式來(lái)進(jìn)行適配解決闲昭；當(dāng)然了，最好的解決辦法就是項(xiàng)目開(kāi)發(fā)過(guò)程中前后端協(xié)商討論數(shù)據(jù)格式靡挥、文件名等代碼規(guī)范序矩，這樣是對(duì)項(xiàng)目的開(kāi)發(fā)效率是會(huì)有很大的提升的；
