适配器模式

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

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


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

Original message: "{{ message }}"

Computed reversed message: "{{ reversedMessage }}"

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

你可能感兴趣的:(适配器模式)