JavaScript多态与适配器模式思考

binta 发布于2019-08-20 12:22 / 2133人阅读

摘要：下面是我仿照适配器模式改进的谷歌地图百度地图适配器参数配置适配器地图只关注发出显示地图而不关注具体用哪种地图当增加了搜搜地图，我们需要添加搜搜地图的方法以及修改适配器地图参数而不需要对函数进行修改搜搜地图

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

GPU云服务器云服务器适配器模式继承与多态 javascript命令模式 javascript严格模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80946.html

学习设计模式前需要知道的事情

摘要：为什么要学习设计模式做事情之前问个为什么总是好的。设计模式的使用方法关于使用方式，像我这种初学者最容易犯的错误就是生搬硬套，但是模仿本来也是学习的一个过程，最重要的事情是在模仿中要学会思考。为什么要学习设计模式？做事情之前问个为什么总是好的。关于设计模式的好坏，我在知乎上也看过一些讨论，有知友对其提出过一些疑问，里面有一些关于设计模式的观点：设计模式有何不妥，所谓的荼毒体现在哪...

kviccn 2019-08-21 10:53 评论0 收藏0
PHP面向对象设计的五大原则

摘要：面向对象设计的五大原则单一职责原则接口隔离原则开放封闭原则替换原则依赖倒置原则。主要是针对继承的设计原则，继承与派生多态是的主要特性。面向对象设计的五大原则：单一职责原则、接口隔离原则、开放-封闭原则、替换原则、依赖倒置原则。这些原则主要是由Robert C.Martin在《敏捷软件开发——原则、方法、与实践》一书中总结出来，这五大原则也是23种设计模式的基础。单一职责原则 Sin...

adam1q84 2019-06-28 18:35 评论0 收藏0
更好理解的面向对象的Javascript 1 —— 动态类型和多态

摘要：动态类型语言和鸭子类型编程语言按照数据类型大体可分为静态类型语言和动态类型语言。鸭子类型的概念至关重要，比如一个对象有了属性，也可以依照下标来存取属性，这个对象就可以被当做数组来使用。前言曾经对Javascript的面向对象相关知识也有过了解，从各种博客、书籍上也学到了很多。但是最近在看《Javascript设计模式与开发实战》这本书时发现该书对这方面的知识点介绍的很易于理解，因此...

shusen 2019-08-23 14:19 评论0 收藏0
JavaScript 适配器模式

摘要：适配器模式旧接口格式和使用者不兼容的情况下需要加一个适配转换接口，无需要改变旧的接口格式电源适配器实现步骤针对类创建一个转换类类中的初始化中创建一个实例利用类的多态特性覆盖类的方法代码实现语法初始化实例覆盖函数式覆盖 showImg(https://segmentfault.com/img/remote/1460000019829430?w=640&h=413); 1. JavaScr...

baihe 2019-08-26 10:14 评论0 收藏0
阿里云前端周刊 - 第 15 期

摘要：推荐为什么我们选择本文是工程师记述在前端技术选型时选用的考虑过程。能够保证较好的类型覆盖，但是其对于多态性的支持并不是很好，并且的社区也相对活跃。引擎就是为解决这一问题而生，在中也是采用该引擎来解析。推荐 1. 为什么我们选择 TypeScript https://redditblog.com/2017/0... 本文是 Reddit 工程师 Niranjan Ramadas 记述在...

stefanieliang 2019-08-20 17:52 评论0 收藏0