js设计模式之 适配器模式与应用场景
作者:互联网
介绍
适配器模式(Adapter Pattern)是作为两个不兼容的接口之间的桥梁。这种类型的设计模式属于结构型模式,它结合了两个独立接口的功能。
这种模式涉及到一个单一的类,该类负责加入独立的或不兼容的接口功能。举个真实的例子,**读卡器是作为内存卡和笔记本之间的适配器。**您将内存卡插入读卡器,再将读卡器插入笔记本,这样就可以通过笔记本来读取内存卡。
简而言之,就两个点:
- 旧接口格式或者使用者不兼容。
- 中间加一个适配转换接口
可以说,适配器就是那个转换器,
接下来看下简易版的UML图
其中,使用者想要使用 target这个插口来充电,发现 现在 插头跟这个插口对不上,于是就找了一个转换器(适配器)Adaptee类似上上图。
代码演示
class Adaptee { specifiRequest(){ return '德国标准插头' } } class Target { constructor(){ this.adaptee = new Adaptee(); } //发现插头插口对不上,于是找了个转换器 。 request(){ let info = this.adaptee.specifiRequest(); return `${info} - 转换器 - 中国标准插头` } } //测试 let target = new Target(); //目标,即插口 let res = target.request();//这个插口不行啊,就发起请求,找了个转换器 console.log(res); // 德国标准插头 - 转换器 - 中国标准插头
经典使用场景
1.封装旧接口
这是我们自己封装的ajax,但这个并不具兼容性,所以可以找个适配器,如果为了兼容,分别写了那么多ajax,就造成了上图所示的历史问题(历史问题包括重构,维护…那些)。
这时就可以自己做一层适配器,来达到兼容的目的
下次使用的时候写 $.ajax(options)就可以了,这个其实就是Jquery中的ajax。
2.Vue computed
可见 computed 中的reversedMessage()其实就是一个适配器(转换器)。
转自:https://blog.csdn.net/weixin_43964148/article/details/102545492
标签:插头,适配器,接口,js,插口,转换器,设计模式,兼容 来源: https://www.cnblogs.com/hjbky/p/14406684.html