javascript 디자인 모드 의 장식 기 모드 (구조 형 모드)
3604 단어 전단 기술js 대상 프로 그래 밍 가이드 학습 노트
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!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
layui 다 중 파일 업로드 에 대하 여 (그림 업로드 의 경우)긴 말 하지 않 고 코드 를 붙 여서 여러분 과 공유 하도록 하 겠 습 니 다. html 코드 블록 js 코드 블록 코드 에 상세 한 주석 이 있 습 니 다. 모 르 는 것 이 있 으 면 메 시 지 를 남 겨 주세요...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.