js适配器模式从java代码到js的简化及在前端编程中应用

适配器模式的定义与理解

将一个接口转换成客户希望的另一个接口，使接口不兼容的那些类可以一起工作，其别名为包装器(Wrapper)。适配器模式既可以作为类结构型模式，也可以作为对象结构型模式。在适配器模式中，我们通过增加一个新的适配器类来解决接口不兼容的问题，使得原本没有任何关系的类可以协同工作。

适配器经典的一个理解例子如下：
旧的插座接口不兼容，加一个适配器适配，使得能供电

传统类图和java代码理解

• 目标接口（Target）：客户所期待的接口。目标可以是具体的或抽象的类，也可以是接口。
• 需要适配的类（Adaptee）：需要适配的类或适配者类。
• 适配器（Adapter）：通过包装一个需要适配的对象，把原接口转换成目标接口。

// 已存在的、具有特殊功能、但不符合我们既有的标准接口的类
class Adaptee {
	public void specificRequest() {
		System.out.println("被适配类具有 特殊功能...");
	}
}
 
// 目标接口，或称为标准接口
interface Target {
	public void request();
}
 
// 具体目标类，只提供普通功能
class ConcreteTarget implements Target {
	public void request() {
		System.out.println("普通类 具有 普通功能...");
	}
}
 
// 适配器类，继承了被适配类，同时实现标准接口
class Adapter extends Adaptee implements Target{
	public void request() {
		super.specificRequest();
	}
}
 
// 测试类public class Client {
	public static void main(String[] args) {
		// 使用普通功能类
		Target concreteTarget = new ConcreteTarget();
		concreteTarget.request();
		
		// 使用特殊功能类，即适配类
		Target adapter = new Adapter();
		adapter.request();
	}
}

这么理解吧：client用户类通过这个Target目标接口实现功能，concreteTarget普通功能类和Adater都实现的这个接口，由Adapter继承Adaptee（旧接口）实现适配功能，

简化类图和js代码

这图类比上面的那个例子就非常好理解了：
Target就相当于适配器，而Adaptee相当于就接口。Client是插头

// 适配器模式
class Adaptee{
    specialRequest(){
        return `外国插座`
    }
}
class Target{
    constructor(){
        this.adaptee = new Adaptee()
    }
    request(){
        let foreignPlug = this.adaptee.specialRequest()
        return `${foreignPlug}--适配--中国插座`
    }
}

const target = new Target()
console.log(target.request());

应用

案例一

当你需要封装自己的ajax时，但是以前都是用jquery的$.ajax写的
就会产生冲突，如果全部手动改回来那会遇到麻烦，这时我们需要自己写一个适配器