javascript 디자인 모드 의 장식 기 모드 (구조 형 모드)

javascript 디자인 모드 의 장식 기 모드
js 의 디자인 모델 은 창설 형 모델, 구조 형 모델 과 행위 모델 로 나 뉜 다
구조 모델 은 새로운 기능 을 제공 하기 위해 대상 을 어떻게 조합 하 는 지 설명 한다.
장식 기 모델 은 흔히 볼 수 있 는 구조 형 모델 로 우 리 는 하나의 기초 대상 을 바탕 으로 몇 개의 장식 대상 을 추가 하여 그 기능 을 확대 할 수 있다.
다음은 예제 코드 입 니 다.
우선 나 는 크리스마스트리 에 작은 것 을 많이 장식 하고 싶다. 즉, 이 방법 을 대충 실현 하 는 것 이다.
var tree = {
  decorate:function (){
    console.log('make some decorates on the tree!');
  }
};

tree.getDecorate('RedBall');
tree.getDecorate('Angle');
tree.getDecorate('BlueBall');

tree.decorate();

우 리 는 이 tree 방법 에 장식 기 를 넣 어야 합 니 다. 장식 기 는 어떻게 써 야 합 니까?
tree.getDecorate = function (deco){
  tree[deco].prototype = this;
  return new tree[deco];
};

tree.RedBall = function (){
  this.decorate = function (){
    this.RedBall.prototype.decorate();
    alert('add a redball on the tree!');
  }
};

tree.BlueBall = function (){
  this.decorate = function (){
    this.BlueBall.prototype.decorate();
    alert('add a blueball on the tree!');
  }
};

tree.Angle = function (){
  this.decorate = function (){
    this.Angle.prototype.decorate();
    alert('there is an anggle on the tree now!');
  }
};

장식 기 를 다 쓰 면 우 리 는 이 장식 기 를 이 크리스마스 트 리 위 에 설치 할 수 있 습 니 다!
tree.getDecorate('RedBall');
tree.getDecorate('BlueBall');
tree.getDecorate('Angle');

tree.decorate();

console 결과 보기:
make some decorates on the tree!
add a redball on the tree!
add a blueball on the tree!
there is an anggle on the tree now!

좋은 웹페이지 즐겨찾기