不多说先上一段代码(转载自《JavaScript设计模式与开发实践》)
//谷歌地图show方法
var googleMap = {
googlShow: function() {
console.log("谷歌地图");
}
};
//百度地图show方法
var baiduMap = {
baiduShow: function() {
console.log("百度地图");
}
};
//渲染地图函数
var renderMap=function(map){
if(map.show instanceof Function){
map.show();
}
};
renderMap(googleMap);//输出:开始渲染谷歌地图
renderMap(baiduMap);//输出:开始渲染百度地图
对于书中抛出的问题,假设每个地图API提供展示地图的方法名都是show,在实际开发中也许不会如此顺利,书中作者提出的思路是借助适配器模式来解决问题。下面是我仿照适配器模式改进的:
var googleMap = {
googlShow: function() {
console.log("谷歌地图");
}
};
var baiduMap = {
baiduShow: function() {
console.log("百度地图");
}
};
//适配器参数配置
var mapArg = {
"googleMap": googleMap.googlShow,
"baiduMap": baiduMap.baiduShow
};
//适配器地图
var adaptMap = {
show: function(arg) {
for (var imap in mapArg) {
for (var fmap in arg) {
if (imap && fmap && mapArg[imap].name==fmap) {
return mapArg[imap]();
}
}
}
}
};
//只关注发出显示地图而不关注具体用哪种地图
var renderMap = function(arg) {
adaptMap.show(arg);
};
//当增加了搜搜地图,我们需要添加搜搜地图的方法以及修改适配器地图参数
//而不需要对renderMap函数进行修改
var sosoMap = {
sosoShow: function() {
console.log("搜搜地图");
}
};
mapArg.sosoMap=sosoMap.sosoShow;
render(sosoMap);