JavaScript设计模式适配器模式实例
更新时间：2022年06月23日 14:16:57 作者： 前端若水
这篇文章主要介绍了JavaScript设计模式适配器模式实例，适配器设计模式可以让彼此不兼容的功能在一块工作，有助于避免大规模的修改代码，并且易于扩展和兼容
前言：
适配器设计模式可以用生活中常用的笔记本电脑来做例子，笔记本使用电压在20v左右，但是我们家用电压在220v左右，所以我们希望用家用电适配对应的笔记本电压，这个时候就需要使用电源适配器
我们可以用我们刚刚说的笔记本电脑来举例子，这是家用电，家用电电压为220V，所以我们返回一下电压数
// 家用电
class Power{
charge(){
return '220V';
}
}
笔记本电源适配器，我们创建一个家用电实例，在通过方法对电压进行转换为笔记本可充电的电压
class Adaptor{
constructor(){
this.power= new Power();
}
charge(){
// 先拿到家用电电压
let voltage=this.power.charge;
// 返回一个转换值
return `${voltage}=>20V`
}
}
电脑，我们创建一个电脑适配器实例，然后电脑适配器实例的电压转换方法对电压进行转换充电
class Computer{
constructor(){
this.adaptor=new Adaptor()
}
// 电脑充电
use(){
console.log(this.adaptor.charge());
}
}
使用：
const cop=new Computer(); //充电 cop.use();
在工作中我们需要使用到多个功能，比如我们项目中使用到了百度地图数据接口和高德地图数据接口,这个时候我们就可以去使用适配器模式
//对百度地图的数据接口操作
const BaiduMap={
show(){
//获取百度地图数据
}
}
//对高德地图的数据接口操作
const GaodeiMap={
show(){
//获取高德地图数据
}
}
//对腾讯地图的数据接口操作
const TxMap={
init(){
//获取腾讯地图数据
}
}
由于他们都有共同点，所以请求数据都为show方法,如果有一天使用到其他的地图请求数据为init的API接口，我们去修改获取数据的方法的话成本太高，这个时候就需要使用到了适配器设计模式，通过switch语句进行匹配方法名，进行调用
//接收俩个参数，第一个是地图模块名，第二个是调用方法
function Adapter(V, fnName) {
switch (fnName) {
case 'show':
V.show()
break;
case 'init':
V.init()
break;
}
}
适配器设计模式可以让彼此不兼容的功能在一块工作，有助于避免大规模的修改代码，并且易于扩展和兼容,但是如果过多的使用适配器，就会使得代码复杂程度增加，看起来十分混乱，维护起来有一定的困难
到此这篇关于JavaScript设计模式适配器模式实例的文章就介绍到这了,更多相关JavaScript 适配器模式内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
在TypeScript(以及JavaScript)中,bind()是一个用于改变函数上下文的方法,下面这篇文章主要给大家介绍了关于Typescript中bind的使用方法及注意事项的相关资料,需要的朋友可以参考下2024-08-08
javascript操作table的特性，大家可以看下，发挥下，实现更多的功能。2009-09-09
这篇文章主要介绍了javascript 中select框触发事件过程的分析的相关资料,这里对select 触发过程进行了深入分析，帮助大家理解这部分内容，需要的朋友可以参考下2017-08-08
这篇文章主要介绍了JavaScript子窗口调用父窗口变量和函数的方法,涉及JavaScript窗口调用的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-10-10
这篇文章主要介绍了微信小程序如何获取openid及用户信息，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-01-01
下面小编就为大家带来一篇JS创建数组的简单方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-07-07
javascript获取时间、时间戳等,最核心的就是利用Date关键词去获取,时间戳的获取方式整理了5种方法,后4种是利用new Date()实例化对象来获取当前时间,再对当前获取的时间再进一步处理获取时间戳,本文给大家介绍的非常详细,需要的朋友参考下吧2023-11-11
这篇文章主要介绍了ES6实现图片切换特效代码，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下2020-01-01
这篇文章主要为大家详细介绍了JS实现简单的表格增删，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-01-01
JavaScript通过function定义对象并给对象添加toString()方法实例分析
这篇文章主要介绍了JavaScript通过function定义对象并给对象添加toString()方法,实例分析了javascript中function定义对象及添加方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
最新评论