내가 이 어뎁터 패턴을 알아보게 된 이유는, client에서 서버에서 받아오는 data를 내 나름의 DTO로 변경하기 위해서 만들었던 함수가 있었다.
그 함수를 친구들이 봤을 때, 이거 adapter pattern 아님? 이라고 말했을 때, 궁금해서 알아보게 되었다.
세상에는 참 많은 디자인 패턴이 있는 것 같다.
어뎁터 패턴은 제가 생각하기로는, 객체를 사용할 때, 호환되게 하기 위해서 변환해주는 것이라고 생각합니다.
위키백과에서는 다음과 같이 말합니다.
어댑터 패턴(Adapter pattern)은 클래스의 인터페이스를 사용자가 기대하는 다른 인터페이스로 변환하는 패턴으로, 호환성이 없는 인터페이스 때문에 함께 동작할 수 없는 클래스들이 함께 작동하도록 해준다.
정적 언어와 동적 언어의 차이인걸로 하고 넘어가겠습니다. (^^7)
만약 제가 서버에 요청을 보내서 response를 받아왔습니다.
그 response는 모두 스네이크 케이스로 되있습니다. 저는 카멜을 쓰기 때문에 그냥 넘어갈 수 없는 부분이죠.
그래서 이 스네이크 케이스로 된 객체를 제가 사용할 카멜 케이스 객체로 바꿔 보겠습니다.
// Response interface
interface UserDataResponse {
user_name: string,
user_id: number,
user_profile_img: string,
}
// DTO interface
interface User {
userName: string,
userId: number,
userProfileImg: string,
}
const UserDataAdapter = (response: UserDataResponse): User => ({
userName: response.user_name,
userId: response.user_id,
userProfileImg: response.userProfileImg,
});
const getResponse = () => {
return axios.post('/user');
}
const main = async () => {
const { data } = await getResponse();
const user = UserDataAdapter(data);
// user를 사용하는 코드들...
}
interface chickenMeet {
닭가슴살: number,
닭다리: number,
}
interface GgungMeet {
꿩가슴살: number,
꿩다리: number,
}
interface 닭 {
getChickenMeet: () => chickenMeet;
}
interface 꿩 {
getGgungMeet: () => GgungMeet;
}
class 닭 {
getChickenMeet(){
alert('꼬꼬덱!');
return 'Chicken Meet';
// 문자열 아니고 닭고기 객체입니다. 꿩 고기와 구조가 다릅니다
}
}
class 꿩 {
getGgungMeet(){
alert('꾸꿔꿩!');
return 'Ggung Meet';
// 문자열 아니고 꿩 객체입니다. 닭 고기와 구조가 다릅니다
}
}
class 꿩 대신 닭 {
constructor(닭){this.닭 = 닭}
getGgungMeet(){
return this.닭.getChickenMeet();
}
}