JavaScript 设计模式读书笔记(七)——适配器模式

AZmake 发布于2019-08-19 14:46 / 818人阅读

摘要：与门面模式的联系本文要说的适配器模式和上一篇门面模式在思想上有相似之处，所以放在一起说。我们以中的一个为例，说说实际应用中的适配器模式的使用方法。而如果实现层的问题不大，要解决一部分适配问题的话，适配器模式就是很好的选择了。

与门面模式的联系

本文要说的适配器模式和上一篇门面模式在思想上有相似之处，所以放在一起说。它们都对类的接口进行了一些改变。门面模式是把相似的或是完成相关任务的接口进行组织，提供给用户一个更加简单易用，更适用于某种业务的接口。而适配器模式是要把一个接口转换为另一个接口，它不对接口的功能进行干涉，它不会简化接口，而是将接口变为更丰富且兼容的接口。

简而言之，门面模式是让本来就可以用的接口变得更好用。而适配器是让不合适的接口变得合适。

适配器的概念

适配器的思想用线框图来表示就是这样：

 +------+          +------+
 |  某  |interface1|  适  | interface2
 |  个--|----------|--配--|------------→
 |  类  |          |  器  |
 +------+          +------+

这个框图能让人想起什么？我想到了这个：

将一个不能直接使用的耳机接头进行转换，成为可以使用的样子。

假设一个类的方法是这样的：

orange.showInfo = function(name, color, weight) {
  console.log(name + " is " + color + " and its weight is " + weight);
};

而我们现有的对象都是这样

var o = {
  name: "classicemi",
  color: "orange",
  weight: "300g"
}

我们当然可以这样使用接口：

orange.showInfo(o.name, o.color, o.weight);

同样，我们也可以：

function adaptedShowInfo(o) {
  orange.showInfo(o.name, o.color, o.weight);
}

// 通过适配过的接口进行调用
adaptedShowInfo(o);

这样，简化了接口的调用过程，对接口进行了一定程度的改造。

jQuery中的适配器

上面提到的适配器写法只是表现了适配器是一个什么样的东西，但实际项目中不会出现这样的代码。我们以jQuery中的一个API为例，说说实际应用中的适配器模式的使用方法。

在jQuery样式相关的API中，最方便使用的就是css()了，这个接口是把set和get的功能合二为一了：

// 既可以像这样调用，取得opacity值
$(".elem").css("opacity");

// 也可以像这样，设置opacity值
$(".elem").css({"opacity": "0.9"});

这是怎么实现的呢，在jQuery核心代码中，与set/get opacity相关的代码如下：

jQuery.cssHooks.opacity = {
  get: function( elem, computed ) {
    // IE uses filters for opacity
    return ropacity.test( (computed && elem.currentStyle ? elem.currentStyle.filter : elem.style.filter) || "" ) ?
      ( 0.01 * parseFloat( RegExp.$1 ) ) + "" :
      computed ? "1" : "";
  },

  set: function( elem, value ) {
    var style = elem.style,
      currentStyle = elem.currentStyle,
      opacity = jQuery.isNumeric( value ) ? "alpha(opacity=" + value * 100 + ")" : "",
      filter = currentStyle && currentStyle.filter || style.filter || "";

    // IE has trouble with opacity if it does not have layout
    // Force it by setting the zoom level
    style.zoom = 1;

    // if setting opacity to 1, and no other filters exist - attempt to remove filter attribute #6652
    // if value === "", then remove inline opacity #12685
    if ( ( value >= 1 || value === "" ) &&
        jQuery.trim( filter.replace( ralpha, "" ) ) === "" &&
        style.removeAttribute ) {

      // Setting style.filter to null, "" & " " still leave "filter:" in the cssText
      // if "filter:" is present at all, clearType is disabled, we want to avoid this
      // style.removeAttribute is IE Only, but so apparently is this code path...
      style.removeAttribute( "filter" );

      // if there is no filter style applied in a css rule or unset inline opacity, we are done
      if ( value === "" || currentStyle && !currentStyle.filter ) {
        return;
      }
    }

    // otherwise, set new filter values
    style.filter = ralpha.test( filter ) ?
      filter.replace( ralpha, opacity ) :
      filter + " " + opacity;
  }
};

通过对传入参数的适配，实现不同的功能。因为不看参数的话，调用的方式是完全一样的。那么从参数下手，通过校验参数的形式，确定用户要实现的功能。

适配器模式的适用场景

适配器不会去改变实现层，那不属于它的职责范围，它干涉了抽象的过程。外部接口的适配能够让同一个方法适用于多种系统。

如果内部的实现出现了问题，需要动手术解决的话，那就不应该使用适配器了，因为那只是治标不治本的方法，反而会增加代码的复杂度。对实现进行全面优化的带来的是真正的改善。而如果实现层的问题不大，要解决一部分适配问题的话，适配器模式就是很好的选择了。

GPU云服务器云服务器适配器模式设计模式学习笔记 head-first设计模式笔记读书笔记

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

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

《JavaScript设计模式与开发实践》读书笔记

摘要：订阅模式的一个典型的应用就是后面会写一篇相关的读书笔记。享元模式享元模式的核心思想是对象复用，减少对象数量，减少内存开销。适配器模式对目标函数进行数据参数转化，使其符合目标函数所需要的格式。设计模式单例模式 JS的单例模式有别于传统面向对象语言的单例模式，js作为一门无类的语言。使用全局变量的模式来实现单例模式思想。js里面的单例又分为普通单例和惰性单例，惰性单例指的是只有这个实例...

Panda 2019-08-23 11:58 评论0 收藏0
《javascript高级程序设计》第六章读书笔记之 javascript对象的几种创建方式

摘要：三种使用构造函数创建对象的方法和的作用都是在某个特殊对象的作用域中调用函数。这种方式还支持向构造函数传递参数。叫法上把函数叫做构造函数，其他无区别适用情境可以在特殊的情况下用来为对象创建构造函数。一、工厂模式工厂模式：使用字面量和object构造函数会有很多重复代码，在此基础上改进showImg(https://segmentfault.com/img/bVbmKxb?w=456&...

xiaotianyi 2019-08-23 14:31 评论0 收藏0
《Tomcat架构解析》读书笔记一

摘要：用来表示一个应用表示实例与当处理请求时，需要将请求映射到具体的容器进行处理请求映射，除了考虑映射规则，这时候还要对进行生命周期的管理组件的注册初始化销毁等等适配器模式解耦，与以及的沟通桥梁 title: Tomcat静态架构date: 2018-10-24 13:46:20tags: tomcat 读书笔记《Tomcat架构解析》读书笔记一大体设计思路接收客户端请求（Co...

rockswang 2019-08-16 13:30 评论0 收藏0
流畅的python读书笔记-第十章-继承优缺点

摘要：继承的优缺点推出继承的初衷是让新手顺利使用只有专家才能设计出来的框架。多重继承的真实应用多重继承能发挥积极作用。即便是单继承，这个原则也能提升灵活性，因为子类化是一种紧耦合，而且较高的继承树容易倒。继承的优缺点推出继承的初衷是让新手顺利使用只有专家才能设计出来的框架。——Alan Kay 子类化内置类型很麻烦 (如 list 或 dict）) ,别搞这种直接子类化内置类型（如 ...

morgan 2019-07-31 11:09 评论0 收藏0