适配器模式

1. 适配器模式?

适配器模式(Adapter): 将一个类的接口转换成另一个接口,一满足用户需求,解决接口不一样产生的兼容问题.

1.1 适配器模式的好处

1. 可以让两个没有关联的类一起运行,
2. 提高了类的复用
3. 增加了类的透明度
4. 灵活性好

适配器的概念很好理解,比如现实生活中我们的手机可能没用有线耳机接口,只有一个type-c接口,这时候我们就得需要一个转换器,来将耳机和手机进行连接, 这个转换器就是一个典型的适配器

1.2适配器场景

• 场景一

/* 
    假如我们现在有一个手机类 phone类, 它有一个recharge(充电)方法, 但它只支持typec数据线,
    此时我们有一个数据线类Android, 如果此时我们想通过Android类来调用phone的recharge方法时
    此时就需要一个转接头, 此时转接头就是一个适配器
*/
class Phone{
    constructor(){
        this.type = "typeC"
    }
    recharge(USB){
        // 必须为typeC接口的才能充电
        if(USB.type === "typeC"){
            console.log('正在充电中');
        }
    }
}
class Android{
    constructor(){
        this.type = "Android"
    }
}
class Change{
    constructor(){}
    connect(phone,usb){
        if(phone.type === "typeC" || usb.type3 === "Android"){
            phone.recharge({type:'typeC'})
        }
    }
}
let phone = new Phone(),
    android = new Android(),
    change = new Change();    
// 调用转接头change的connect方法
console.log(change.connect(phone,android));// 正在充电中

• 场景二:

 /* 
    某个项目中我们用到了axios库发起了ajax请求,获取到了数据data,data是一个数组格式,
    而后端更新了,将返回的数据换成了键值对格式,此时我们修改用来写好的代码成本比较大
    所以我们可以加一段适配代码
  */
  axios.get("http://localhost:3001/teacher")// url
        .then(res =>{
            res = res.data
            //以前的msg是数组格式： ["张三" , "18" , "男"]
            //后端数据格式更新为 {name:"张三",age:"18",sex:"男}
            //done函数代码已成一个完整的逻辑，修改接口参数类型的话很麻烦
            //所以我们添加适配器：
          // res = [res.name, res.age, res.marry];
          // 假如此时后端的数据格式又变成了[ {name:"张三",age:"18",sex:"男}, {name:"王五",age:"20",sex:"男}]
          // 此时我们就得重新添加一个适配器
           res =  res.reduce((t,v) =>{
               t = [...t,...Object.values(v)]
               return t
            },[])
            done(res)
        })
       
function done(data){
    data.forEach(item =>{
       // code...
    })
}

上面举的例子都是适配器代码是比较简单的,实际过程中可能需要的适配器代码会更多一些，但是原理是一样的。

总结: 由于各种原因(结构升级. 优化代码等), 导致接口和之前的不一样,而重构整个代码是很麻烦的吗使用我们使用适配器代码将接口转换一下以保证能正确的使用,这就是适配器的作用.