
출처: 에릭 감마 , 리처드 헬름 , 랄프 존슨 , 존 블리시디스. 『Gof의 디자인 패턴』. 김정아(역). 프로텍미디어, 2015.
[10일차] 탬플릿 메소드(Template Method)
행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴
타입스크립트로 설명하는 GoF 디자인 패턴의 행동 패턴 11일만에 끝내기 챌린지
탬플릿 메소드란?
객체의 연산에는 알고리즘의 뼈대만을 정의하고
각 단계에서 수행할 구체적 처리는 서브클래스쪽으로 미루는 패턴이다.
알고리즘의 구조 자체는 그대로 놔둔 채
알고리즘 각 단계의 처리를 서브클래스에서 재정의할 수 있게 한다.
활용성
1) 어떤 한 알고리즘을 이루는 부분 중 변하지 않는 부분을 한 번 정의해 놓고
다양해질 수 있는 부분은 서브클래스에서 정의할 수 있도록 남겨두고자 할 때
2) 서브클래스 사이의 공통적인 행동을 추출하여
하나의 공통 클래스에 몰아둠으로써 코드 중복을 피하고 싶을 때
3) 템플릿 메서드가 어떤 특정한 시점에 '훅' 연산을 호출하도록 정의함으로써
그 특정 시점에서만 서브클래스의 확장을 제어하고 싶을 때
구조 및 구현
abstract class AbstractClass {
abstract primitiveOperation1(): void
abstract primitiveOperation2(): void
templateMethod() {
this.primitiveOperation1()
console.log('Something')
this.primitiveOperation2()
}
}
class ConcreteClass extends AbstractClass {
primitiveOperation1() {
console.log('primitiveOperation1')
}
primitiveOperation2() {
console.log('primitiveOperation2')
}
}
class Main {
constructor() {
const concreteClass = new ConcreteClass()
concreteClass.templateMethod()
// primitiveOperation1
// Something
// primitiveOperation2
}
}
공식 기술블로그 링크
더넥스트웹리서치랩
웹 클라이언트 기술을 전문적으로 연구하고 자료를 발행하는 기술 블로그를 운영합니다.
the-next-web-research-lab.github.io
728x90
'프런트엔드 > 디자인 패턴' 카테고리의 다른 글
Proxy, Reverse Proxy, Load Balancer 의 차이 (0) | 2024.01.03 |
---|---|
[11일차] 방문자 | 행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴 (0) | 2023.07.16 |
[9일차] 전략 | 행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴 (0) | 2023.07.16 |
[8일차] 상태 | 행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴 (0) | 2023.07.16 |
[7일차] 옵저버 | 행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴 (0) | 2023.07.16 |