最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

JavaScript多态与适配器模式思考

来源:动视网 责编:小采 时间:2020-11-27 20:31:32
文档

JavaScript多态与适配器模式思考

JavaScript多态与适配器模式思考:不多说先上一段代码(转载自《JavaScript设计模式与开发实践》) //谷歌地图show方法 var googleMap = { googlShow: function() { console.log("谷歌地图"); } }; //百度地图show方法 var baiduMap = { baiduS
推荐度:
导读JavaScript多态与适配器模式思考:不多说先上一段代码(转载自《JavaScript设计模式与开发实践》) //谷歌地图show方法 var googleMap = { googlShow: function() { console.log("谷歌地图"); } }; //百度地图show方法 var baiduMap = { baiduS


不多说先上一段代码(转载自《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);

文档

JavaScript多态与适配器模式思考

JavaScript多态与适配器模式思考:不多说先上一段代码(转载自《JavaScript设计模式与开发实践》) //谷歌地图show方法 var googleMap = { googlShow: function() { console.log("谷歌地图"); } }; //百度地图show方法 var baiduMap = { baiduS
推荐度:
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top