适配器模式

◆ 旧接口格式和使用者不兼容
◆ 中间加一个适配转换接口

这个插座图可代表适配器模式

image.png

应用场景：
◆ 封装旧接口
◆ vue计算属性computed

适配器模式符合以下设计原则：
◆ 将旧接口和使用者进行分离
◆ 符合开放封闭原则

1. demo展示

image.png

class Adaptee {
  specificRequest() {
    return '德国标准的插头'
  }
}
class Target {
  constructor() {
    this.adaptee = new Adaptee()
  }
  request() {
    Letinfo = this.adaptee.specificRequest()
    return `${info} -> 转换器 -> 中国标准的插头`
  }
}
//测试
let target = new Target()
target.request()

2. vue computed

<div id="example">
  <p>Original message: "{{ message }}"</p>
  <p>Computed reversed message: "{{ reversedMessage }}"</p>
</div>

var vm = new Vue({
  el: '#example',
  data: {
    message: 'Hello'
  },
  computed: {
    // 计算属性的getter
    reversedMessage: function () {
      // this指向vm实例
      return this.message.split(' ').reverse().join(' ')
    }
  }
})