JavaScript多態與適配器模式思考

很少說先上一段代碼(轉載自《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);
相關文章
相關標籤/搜索