자바스크립트 디자인패턴 - 데코레이터 (Decorator)

pa324·2019년 11월 15일
1

데코레이터(Decorator)

  • 데코레이터는 기존 객체의 동작을 동적으로 추가시키는 구조적인 패턴
  • 서브클래스를 생성하는 것보다 융통성 있는 방법 제공
  • 가끔, 전체 클래스에 새로운 기능을 추가할 필요는 없지만 ,개별적인 객체에 새로운 책임을 추가할 필요가 있다
    • GUI 툴킷에서 모든 사용자 인터페이스 요소에는 필요 없지만, 어떤 사용자 인터페이스 요소에만 스크롤링과 같은 행동이나 테투리와 같은 속성을 추가할 수 있도록 할경우
  • 동일한 클래스의 모든 객체에 추가되지 않고, 명시적으로 데코레이트한 인스턴스에만 추가되기 때문에 상속과는 다르다.
  • 프록시 패턴과 유사하지만, 객체의 기존 인터페이스 동작을 향상하거나 수정하는것이 아닌, 새로운 기능으로 기능을 추가시킨다.
  • 데코레이터 패턴을 이용하면 유연하게 인스턴스를 생성할 수 있다.

데코레이터 패턴 구현

//What we're going to decorate
function MacBook() {
    this.cost = function () { return 997; };
    this.screenSize = function () { return 13.3; };
}
/*Decorator 1*/
function Memory(macbook) {
    var v = macbook.cost();
    macbook.cost = function() {
        return v + 75;
    }
}
 /*Decorator 2*/
function Engraving( macbook ){
   var v = macbook.cost();
   macbook.cost = function(){
     return  v + 200;
  };
}

/*Decorator 3*/
function Insurance( macbook ){
   var v = macbook.cost();
   macbook.cost = function(){
     return  v + 250;
  };
}
var mb = new MacBook();
Memory(mb);
Engraving(mb);
Insurance(mb);
console.log(mb.cost()); //1522
console.log(mb.screenSize()); //13.3
profile
안녕하세요

0개의 댓글