资讯专栏INFORMATION COLUMN

JavaScript 适配器模式

baihe / 1341人阅读

摘要:适配器模式旧接口格式和使用者不兼容的情况下需要加一个适配转换接口,无需要改变旧的接口格式电源适配器实现步骤针对类创建一个转换类类中的初始化中创建一个实例利用类的多态特性覆盖类的方法代码实现语法初始化实例覆盖函数式覆盖

1. JavaScript 适配器模式

旧接口格式和使用者不兼容的情况下需要加一个适配转换接口,无需要改变旧的接口格式

eg: 电源适配器

实现步骤

针对 A 类创建一个 B 转换类

B 类中的 constructor 初始化中创建一个实例 instance

利用类的多态特性覆盖 A 类的方法

代码实现 class 语法
class Plug {
    constructor(type) {
        this.type = type
    }
    getType() {
        return this.type
    }
}

class Adapter {
    constructor(oldType, newType) {
        this.plug = new Plug(oldType) // 初始化实例
        this.oldType = oldType
        this.newType = newType
    }
    getOldType() {
        return this.oldType
    }
    getType() { // 覆盖
        return this.newType
    }
}

let adapter = new Adapter("hdmi", "typec")
let res = adapter.getType()
res // typec

res = adapter.getOldType()
res // hdmi
函数式
let hdmi = {
    getType() {
        return "HDMI"
    }
}

let typeC = {
    getType() {
        return "type-c"
    }
}

function typeCAdapter(plug) {
    return {
        getType() { // 覆盖
            return hdmi.getType()
        }
    }
}

res = typeCAdapter(typeC).getType()
res // HDMI

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

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

相关文章

  • JavaScript 设计模式(四):适配模式

    摘要:与其它模式的异同适配器模式不会改变原有接口,这一点与装饰者模式和代理模式类似。代理模式适配器模式与代理模式最相似,同样都是创建一个新对象包装一次,实现对本体的调用。外观模式外观模式与适配器模式最大的区别,是定义了一个新的接口。 showImg(https://segmentfault.com/img/bVbul8d?w=800&h=600); 适配器模式:将一个类(对象)的接口(方法或...

    MingjunYang 评论0 收藏0
  • JavaScript设计模式系列五:配器模式

    摘要:什么是适配器模式所谓适配器模式就是用一个新的接口对现有的接口进行包装,处理类与的不匹配。对象适配器可以适配它的父对象接口方法或属性。装饰者模式增强了对象的功能而同时又不改变它的接口,因此它对程序的透明度比适配器要好。 什么是适配器模式 所谓 适配器模式 就是用一个新的接口对现有的接口进行包装,处理类与API的不匹配。使用这种模式的对象又叫作包装器。比如我们有一个接口: function...

    banana_pi 评论0 收藏0
  • 从ES6重新认识JavaScript设计模式(四): 配器模式

    摘要:什么是适配器模式适配器模式将一个类的接口转换成客户希望的另外一个接口,使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。中的适配器模式在前端项目中,适配器模式的使用场景一般有以下三种情况库的适配参数的适配和数据的适配。 1 什么是适配器模式 适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口,使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。 在...

    URLOS 评论0 收藏0
  • 从ES6重新认识JavaScript设计模式(四): 配器模式

    摘要:什么是适配器模式适配器模式将一个类的接口转换成客户希望的另外一个接口,使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。中的适配器模式在前端项目中,适配器模式的使用场景一般有以下三种情况库的适配参数的适配和数据的适配。 1 什么是适配器模式 适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口,使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。 在...

    赵连江 评论0 收藏0
  • JavaScript设计模式配器模式

    摘要:旧接口格式和使用者不兼容,中间加一个适配器转换接口。模式作用使用一个已经存在的对象,但其方法或接口不符合你的要求。 原文博客地址:https://finget.github.io/2018/11/22/adapter/ 适配器模式 适配器模式(Adapter)是将一个类(对象)的接口(方法或属性)转换成客户希望的另外一个接口(方法或属性),适配器模式使得原本由于接口不兼容而不能一起工作...

    CNZPH 评论0 收藏0
  • JavaScript 设计模式读书笔记(七)——配器模式

    摘要:与门面模式的联系本文要说的适配器模式和上一篇门面模式在思想上有相似之处,所以放在一起说。我们以中的一个为例,说说实际应用中的适配器模式的使用方法。而如果实现层的问题不大,要解决一部分适配问题的话,适配器模式就是很好的选择了。 与门面模式的联系 本文要说的适配器模式和上一篇门面模式在思想上有相似之处,所以放在一起说。它们都对类的接口进行了一些改变。门面模式是把相似的或是完成相关任务的接...

    AZmake 评论0 收藏0

发表评论

0条评论

baihe

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<