This content originally appeared on DEV Community and was authored by Abhirup Datta
This is part of the design pattern series in Typescript
What and why adapter pattern is needed ?
The adapter pattern converts the interface of a class into another interface the client expects.Adapter lets classes work together that couldn't otherwise because of incomparable interfaces.
Ok, that's a lot of jargon so lets break it down 🔨.
Example
Generally, we have two types of mobile charging ports - USB C and MicroUSB (or USB B).Their interfaces (port structure) are different.
Now, suppose you have a phone with MicroUSB port but you dont't have its cable, but you have a USB C cable. So what you do ?
You will get an adapter which lets you "convert" USBC to MicroUSB.
Code Snippet 1
function charge( usbc: USBCCharger){
usbc.chargeByUSBC();
}
Here are four conceptual terms that we will need to know:
- Adapter: The connector which helps to adapt (or connect).
- Target: A class which will be converted from. In the code snippet 1, USBCCharger is the target.
-
Client: Someone (the user) using the Target class . In the code snippet 1, function
chargeis the client. - Adaptee: The class whose methods will actually be called by the adapter.
Code snippet 2
Let us define a USBC class which has a charge method.
class USBCCharger{
chargeByUSBC(){
console.log("charging by USBCCharger")
}
}
Code snippet 3
Let us define a MicroUSB class which also has a charge method.
class MicroUSBCharger{
chargeByMicroUsb(){
console.log("charging by MicroUSBCharger")
}
}
Code snippet 4
Now, the adapter class which targets USBC charger so we can invoke charge (of Code snippet 1) by using MicroUSBCharger as an adaptee
can be written as:
class USBCAdapter implements USBCCharger{
private usb:MicroUSBCharger;
constructor(usb: MicroUSBCharger){
this.usb = usb;
}
chargeByUSBC() {
// can do conversions if needed etc.
this.usb.chargeByMicroUsb();
}
}
Code snippet 5
Here is the test code to test the Adapter pattern
Test
function charge( usbc: USBCCharger){
usbc.chargeByUSBC();
}
const usbC = new USBCCharger();
charge(usbC);
const microUsb = new MicroUSBCharger();
const adapter = new USBCAdapter(microUsb);
charge(adapter);
Output
Code for this and other patterns can be found here: https://github.com/abhidatta0/Essential-design-patterns-in-Typescript
Lets break down the USBCAdapter class (Code Snippet 4).
class USBCAdapter implements USBCCharger-> The class USBCAdapter implements USBCAdapter because this is what the clientchargeof code snippet 1 expectsconstructor(usb: MicroUSBCharger)-> Here while creating an instance of USBCAdapter we need to get the reference of the object we are adapting (in this example MicroUSBCharger)chargeByUSBCmethod -> Now we need to implement all the methods of the target class (USBCCharger) and translate them to adaptee class(MicroUSBCharger)
Note
Don't think of the Adapter class simply as a wrapper over Adaptee class.It is for the purpose of converting the interface of a class into another interface the client expects.
The adapter pattern is a widely used design pattern in software engineering.It is often used when working with a legacy class and adapt it to a new class.
That’s it 😅
Code for this and other patterns can be found here: https://github.com/abhidatta0/Essential-design-patterns-in-Typescript
This content originally appeared on DEV Community and was authored by Abhirup Datta
Abhirup Datta | Sciencx (2024-08-04T03:31:44+00:00) Adapter Design Pattern. Retrieved from https://www.scien.cx/2024/08/04/adapter-design-pattern/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.