장식자 모드와 향원 모드

2390 단어 장식자 모드

장식자 모드, 영어 이름: Decorator.


장식자 기본 개념: 장식자는 기존 시스템을 수정하는 데 사용할 수 있으며 시스템에 대상에 추가 기능을 추가하기를 원하며 대상의 베이스 코드를 수정하여 추가 기능을 추가할 필요가 없다.
간단한 예를 들면 다음과 같습니다.
function vehicle(type){
	this.vehicleType = type || "car";
	this.model = "default";
}
var testInstance = new vehicle();
console.log(testInstance);    //{vehicleType:"car",model:"default"}
var truck = new vehicle();    // vehicle 
truck.setModel = function(modelName){   // truck 
	this.model = modelName;
}
truck.setModel("chaojidan");
var secondInstance = new vehicle();
secondInstance.setModel(); //

위의 코드에서truck 대상은 setModel 방법이 있지만 vehicle 구조 함수의 코드를 바꾸지 않았고 뒤에 실례화된 대상인secondInstance에 영향을 주지 않았다.
위의 이 예는 장식자 모델의 장점을 잘 보여주지 못한다.  
장식자는 동적으로 대상을 수정할 수 있기 때문에 기존 시스템을 바꾸는 데 사용되는 완벽한 모델이다.
실제 적용: jQuery.extend 방법은 실행할 때 두 개 이상의 대상을 하나의 단일한 대상으로 동적으로 합쳐서 이 단일한 대상으로 되돌려줍니다.
이러한 상황에서 하나의 목표 대상이나 되돌아오는 단일 대상은 이미 다른 대상(두 개 또는 두 개 이상의 대상)이 가지고 있는 모든 방법과 속성을 가지고 다른 대상(두 개 이상의 대상)의 방법과 속성을 다시 쓰거나 파괴하지 않는다.(물론 목표 대상은 다시 썼지만, 이것도 우리가 장식한 대상이다)

형원 모드, 영어 이름: Flyweight.


기본 개념: 관련 대상과 가능한 한 많은 데이터를 공유함으로써 응용 프로그램의 메모리 사용을 줄인다.
실천에서 향원 모델은 여러 대상이 사용하는 비슷한 데이터를 얻고 이 데이터를 단일한 외부 대상에 놓는다.우리는 모든 대상이 같은 데이터를 저장하는 것이 아니라 이 대상(단일한 외부 대상)을 이 데이터에 의존하는 대상에게 전달할 수 있다.
향원 모드는 브라우저에서 주로 이벤트 의뢰에 사용됩니다.
예를 들면 다음과 같습니다.
한 페이지에 비슷한 요소가 있다고 가정하면 사용자가 사용자 동작 (클릭, 마우스 정지) 을 실행할 때 같은 비슷한 행동을 한다.모든 요소에 같은 이벤트와 이벤트 처리 함수를 연결할 필요가 없습니다. 향원을 페이지의document에 쉽게 첨부할 수 있습니다. 이것은 다른 요소에서 온 이벤트를 감청할 수 있습니다. 그러면 우리는 한 번의 이벤트와 한 개의 이벤트 처리 편지를 연결할 수 있습니다.
James Padolsey가 jQuery 개발 성능을 향상시키기 위해 제안한 질문에 대해 살펴보겠습니다.
$("div").on("click",function(){
	$(this).css();
	$(this).html();
});

위 코드에서, 리셋 함수에서, 우리는this를 jQuery 대상으로 포장하여, jQuery가 제공하는 방법을 호출하고, 위에서this를 두 번 포장했다. (여기서는 국부 변수로 $(this)를 저장하는 상황을 고려하지 않는다.
James Padolsey는 같은 대상을 여러 번 jQuery 대상으로 포장하는 방법이 좋지 않다고 생각해서 다음과 같은 방법을 생각해냈다.
jQuery.single (), 이 방법은 같은 jQuery 대상을 되돌려줍니다. 예를 들어 위의 코드는 jQuery를 사용할 수 있습니다.single(this).css(),jQuery.single(this).jQuery로 인해 html()이 대체됩니다.single 방법은 같은 jQuery 대상을 되돌려주기 때문에this에 한 번만 포장합니다.이런 방법은 기술적으로도 향원 모델의 운용이다.jQuery.single 메서드가 반환하는 jQuery 객체가 바로 형원 객체입니다.
 
 
 
 
파이팅!

좋은 웹페이지 즐겨찾기