JavaScript之适配器模式实例

àì夳堔傛蜴生んèń 2022-05-27 02:58 87阅读 0赞

一、适配器模式：是为了解决软件实体间的接口不兼容的问题。适配器的别名是包装器（wrapper）；

二、首先，假设我们已经有如下代码：

var googleMap = {
        show: function(){
           console.log( '开始渲染谷歌地图' );
        }
    };
    
    var baiduMap = {
        show: function(){
           console.log( '开始渲染百度地图' );
        }
    };
    
    var renderMap = function( map ){
        if( map.show instanceof Function ){
             map.show();
        }
    }
    
    renderMap( googleMap );
    renderMap( baiduMap );

三、上述代码中googleMap和baiduMap都提供了show方法，如果要添加其他的地图进行渲染工作，则同样要提供show方法。但如果有一家地图的显示地图的方法不叫show呢？

我们可以利用适配器模式来处理，如下：

var googleMap = {
        show: function(){
           console.log( '开始渲染谷歌地图' );
        }
    };
    
    var baiduMap = {
        show: function(){
           console.log( '开始渲染百度地图' );
        }
    };
    
    var tiandituMap = {
        display: function(){
           console.log( '开始渲染天地图地图' );
        }
    };
    //为了统一show方法，为天地图添加适配器
    var tiandituMapAdapter = { 
        show: function(){
            return tiandituMap.display();
        }
    };
    
    var renderMap = function( map ){
        if( map.show instanceof Function ){
             map.show();
        }
    }
    
    renderMap( googleMap );
    renderMap( baiduMap );
    renderMap( tiandituMapAdapter );

发表评论取消回复

表情：

评论列表（有 0 条评论，87人围观）

还没有评论，来说两句吧...

相关阅读

相关 java适配器模式之接口适配器

原理：通过抽象类来实现适配。　　当存在这样一个接口，其中定义了N多的方法，而我们现在却只想使用其中的一个到几个方法，如果我们直接实现接口，那么我们要对所有的方法进行实现，

阳光穿透心脏的1/2处/ 2024年02月18日 20:54/ 0 赞/ 51 阅读

相关 JavaScript 23 种设计模式之 7 适配器模式

概念与特点概念：调用不同对象的统一接口，如果是外部提供的名称不相同的接口，就需要适配器来转换。比如手机充电器的转换头，既可以充电安卓手机，也可以充电苹果手手机。

小鱼儿/ 2023年03月13日 01:57/ 0 赞/ 2 阅读

相关设计模式之适配器模式（类适配器、对象适配器、接口适配器）

适配器模式文章目录适配器模式一、概述二、定义和结构 1. 定义 2. 结构

不念不忘少年蓝@/ 2022年10月14日 08:44/ 0 赞/ 238 阅读

相关设计模式之---适配器模式

适配器模式适配器模式(Adapter Pattern)：将一个接口转换成客户希望的另一个接口，使接口不兼容的那些类可以一起工作，其别名为包装器(Wrapper)。适配器模

- 日理万妓/ 2022年06月08日 00:15/ 0 赞/ 221 阅读

相关 JavaScript之适配器模式实例

一、适配器模式：是为了解决软件实体间的接口不兼容的问题。适配器的别名是包装器（wrapper）；二、首先，假设我们已经有如下代码： var googleMap =

àì夳堔傛蜴生んèń/ 2022年05月27日 02:58/ 0 赞/ 88 阅读

相关 JavaScript之状态模式实例

一、状态模式定义：允许一个对象在其内部状态改变时改变它的行为，对象看起来似乎修改了它的类。二、状态模式的关键是区分事物内部的状态，事物内部状态的改变往往会带来事物的行为改变

左手的ㄟ右手/ 2022年05月27日 02:56/ 0 赞/ 77 阅读

相关 javascript-适配器模式

将一个类(对象)的接口（方法或属性）转化成另一个接口，以满足用户需求，使类（对象）之间接口的不兼容性问题通过适配器方法得以解决适配器主要有3个角色组成：（1）客户端：

川长思鸟来/ 2021年11月17日 12:28/ 0 赞/ 446 阅读

相关 JavaScript设计模式——适配器模式

介绍旧接口模式与使用者不兼容中间加一个适配器转换接口类似于笔记本电脑与显示器之间的转换线来看个例子： class Adaptee {

逃离我推掉我的手/ 2021年08月24日 17:39/ 0 赞/ 334 阅读

相关适配器模式_适配器模式简单实例

适配器模式简介适配器模式是java设计模式中的一种结构型设计模式，如果是在系统中存在接口不兼容的接口，可以通过引入一个接口来使原本因为接口不兼容而不能一起工

深碍√TFBOYSˉ_/ 2021年07月24日 22:22/ 0 赞/ 458 阅读

相关 JavaScript设计模式(八)【适配器模式】

jquery适配器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="

左手的ㄟ右手/ 2021年07月04日 15:33/ 0 赞/ 347 阅读