javascript设计模式 ? 适配器模式原理与应用实例分析


Posted in Javascript onApril 13, 2020

本文实例讲述了javascript设计模式 ? 适配器模式原理与应用。分享给大家供大家参考,具体如下:

介绍:适配器模式的产生也来自具体的问题,拿mac来举例,我不能直接用mac链接VGA,不能直接连接网线接口,这是就需要提供一些转接头,来将一些特殊的接口与我们的火线口相链接。

在这个过程中转接头就相当于一类适配器,mac被转接头所扩展,所以mac称之为适配者。适配器的主要作用是将客户端的请求转化为对适配者接口的调用。好多场景下因为接口的不兼容,

多一个参数少一个参数,参数格式不正确,调用顺序等等问题导致无法直接的相互调用,适配器就是这之间作为调和的方法。

定义:将一个接口转换成客户希望的另一个接口,使接口不兼容的那些类可以一起工作,其别名为包装器(Wrapper)。适配器模式既可以作为类结构型模式,也可以作为对象结构模型。

场景:我们假设一个场景。Common组件中提供了对数组排序以及查询的方法,需要同时传递数组以及查询条件。但现在有一个场景,是我能获取到数组的位置和我使用查找结果的位置不在一处。
所以我们腰痛过适配器对这一类场景进行适配兼容。

示例:

var Common = function(){
  this.QuickSort = function(arr){
    console.log('QuickSort')
  };
  this.searchBykey = function(arr,key){
    console.log('sort');
  }
}
 
var OperationAdapter = function(){
  this.QuickSort = new Common();
  this.arr = [];
  this.setArr = function(arr){
    this.arr = arr;
  };
  this.sort = function(){
    this.QuickSort.QuickSort(this.arr);
  };
  this.search = function(key){
    this.QuickSort.searchBykey(this.arr, key);
  };
}
 
var adapter = new OperationAdapter();
adapter.setArr(['1', '12', '123'])
adapter.sort(); //QuickSort
adapter.search('123'); //sort

适配器模式总结:

优点:

* 将使用与适配类解耦,通过适配器来解决定制化需求,无需对原有结构进行修改
* 一个适配器可以把多个不同的适配者适配到同一目标。
* 适配器的灵活性和扩展性都非常好,添加修改也很方便,符合开闭原则

缺点:

* 适配器与业务耦合严重,导致适配器的修改需要兼顾所有使用场景

适用场景:

* 系统需要使用现有类,而现有类不符合系统需求

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
破解Session cookie的方法
Jul 28 Javascript
javascript 动态table添加colspan\rowspan 参数的方法
Jul 25 Javascript
JQuery1.4+ Ajax IE8 内存泄漏问题
Oct 15 Javascript
jquery 插件学习(六)
Aug 06 Javascript
把Node.js程序加入服务实现随机启动
Jun 25 Javascript
JS上传组件FileUpload自定义模板的使用方法
May 10 Javascript
超详细的JS弹出窗口代码大全
Apr 18 Javascript
js Date()日期函数浏览器兼容问题解决方法
Sep 12 Javascript
JS的函数调用栈stack size的计算方法
Jun 24 Javascript
通过jQuery学习js类型判断的技巧
May 27 jQuery
JS字符串常用操作方法实例小结
Jun 24 Javascript
webpack的pitching loader详解
Sep 23 Javascript
JavaScript创建表格的方法
Apr 13 #Javascript
JavaScript实现捕获鼠标坐标
Apr 12 #Javascript
jquery实现轮播图特效
Apr 12 #jQuery
用jQuery实现抽奖程序
Apr 12 #jQuery
javascript实现画板功能
Apr 12 #Javascript
JS实现随机点名器
Apr 12 #Javascript
微信小程序实现抖音播放效果的实例代码
Apr 11 #Javascript
You might like
隐藏X-Space个人空间下方版权方法隐藏X-Space个人空间标题隐藏X-Space个人空间管理版权方法
2007/02/22 PHP
PHP中数组合并的两种方法及区别介绍
2012/09/14 PHP
PHP提示Cannot modify header information - headers already sent by解决方法
2014/09/22 PHP
php判断两个浮点数是否相等的方法
2015/03/14 PHP
PHP获取文件夹大小函数用法实例
2015/07/01 PHP
Yii2使用自带的UploadedFile实现的文件上传
2016/06/20 PHP
PHP校验15位和18位身份证号的类封装
2018/11/07 PHP
基于jquery的Repeater实现代码
2010/07/17 Javascript
DIV始终居中的js代码
2014/02/17 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
浅谈JavaScript的自动垃圾收集机制
2016/12/15 Javascript
JS实现Ajax的方法分析
2016/12/20 Javascript
Node.js读取文件内容示例
2017/03/07 Javascript
使用JavaScript实现点击循环切换图片效果
2017/09/03 Javascript
[01:18:33]Secret vs VGJ.S Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
用Python登录Gmail并发送Gmail邮件的教程
2015/04/17 Python
Python实现的读取电脑硬件信息功能示例
2018/05/30 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
jupyter 添加不同内核的操作
2021/02/06 Python
python中最小二乘法详细讲解
2021/02/19 Python
CSS3五个技巧给你的网站带来出色的效果
2009/04/02 HTML / CSS
HTML5的语法变化介绍
2013/08/13 HTML / CSS
详解HTML5 data-* 自定义属性
2018/01/24 HTML / CSS
canvas裁剪clip()函数的具体使用
2018/03/01 HTML / CSS
高档奢华时装在线目的地:FORWARD by elyse walker
2017/10/16 全球购物
Omio意大利:全欧洲低价大巴、火车和航班搜索和比价
2017/12/02 全球购物
PHP笔试题
2012/02/22 面试题
幼儿园教师备课制度
2014/01/12 职场文书
毕业证丢失证明
2014/01/15 职场文书
马智宇结婚主持词
2014/04/01 职场文书
2015年乡镇工作总结范文
2015/04/22 职场文书
2019年共青团工作条例最新版
2019/11/12 职场文书
Pytorch 统计模型参数量的操作 param.numel()
2021/05/13 Python
python基于turtle绘制几何图形
2021/06/15 Python
SQL实战演练之网上商城数据库商品类别数据操作
2021/10/24 MySQL
关于python pygame游戏进行声音添加的技巧
2021/10/24 Python