장식자 모드와 향원 모드
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 객체가 바로 형원 객체입니다.
파이팅!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
js 디자인 모드(7)---장식자 모드
선언
오후에 일하는 효율이 매우 낮고 풀이 죽어서 머리 전체가 풀과 같다.
시간이 조금씩 흐르는 것을 보면 마음속으로 어쩔 수 없다.
아이고, 우리의 열정이 이렇게 쉽게 꺼질까?
1. 이 모드의 사용 상황
만약에 우...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
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(); //
기본 개념: 관련 대상과 가능한 한 많은 데이터를 공유함으로써 응용 프로그램의 메모리 사용을 줄인다.
실천에서 향원 모델은 여러 대상이 사용하는 비슷한 데이터를 얻고 이 데이터를 단일한 외부 대상에 놓는다.우리는 모든 대상이 같은 데이터를 저장하는 것이 아니라 이 대상(단일한 외부 대상)을 이 데이터에 의존하는 대상에게 전달할 수 있다.
향원 모드는 브라우저에서 주로 이벤트 의뢰에 사용됩니다.
예를 들면 다음과 같습니다.
한 페이지에 비슷한 요소가 있다고 가정하면 사용자가 사용자 동작 (클릭, 마우스 정지) 을 실행할 때 같은 비슷한 행동을 한다.모든 요소에 같은 이벤트와 이벤트 처리 함수를 연결할 필요가 없습니다. 향원을 페이지의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 객체가 바로 형원 객체입니다.
파이팅!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
js 디자인 모드(7)---장식자 모드선언 오후에 일하는 효율이 매우 낮고 풀이 죽어서 머리 전체가 풀과 같다. 시간이 조금씩 흐르는 것을 보면 마음속으로 어쩔 수 없다. 아이고, 우리의 열정이 이렇게 쉽게 꺼질까? 1. 이 모드의 사용 상황 만약에 우...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.