자바스크립트 시리즈 심층이해(27): 디자인 패턴의 빌더 패턴에 대한 자세한 설명_자바스크립트 스킬

소개

소프트웨어 시스템에서는 때때로 요구사항 변경으로 인해 특정 알고리즘을 사용하여 각 부분의 하위 개체로 구성되는 "복잡한 개체"가 생성되는 경우가 많습니다. 급격한 변화에 직면하지만 이를 결합하는 알고리즘은 비교적 안정적입니다. 이 변화에 어떻게 대처해야 할까요? 요구 사항이 변경됨에 따라 시스템의 "안정적인 구성 알고리즘"이 변경되지 않도록 "복잡한 개체의 다양한 부분"의 변경 사항을 격리하는 "캡슐화 메커니즘"을 제공하는 방법은 무엇입니까? 이것이 바로 빌더 패턴(Builder Pattern)이라고 불리는 것입니다.

빌더 패턴은 복잡한 객체의 구성을 표현과 분리할 수 있으므로 동일한 구성 프로세스가 다른 표현을 생성할 수 있습니다. 즉, 빌더 모드를 사용하는 경우 사용자는 이를 얻기 위해 빌드할 유형을 지정해야 하며 특정 구성 프로세스 및 세부 사항을 알 필요가 없습니다.

텍스트

이 모드는 비교적 간단합니다. 먼저 코딩한 후 설명하세요.

코드 복사 코드는 다음과 같습니다.

함수 getBeerById(id, 콜백) {
// ID를 사용하여 데이터를 요청한 후 데이터를 반환합니다.
asyncRequest('GET', 'beer.uri?id=' id, 함수(resp) {
// 콜백 호출 응답
         콜백(resp.responseText);
});
}

var el = document.querySelector('#test');
el.addEventListener('click', getBeerByIdBridge, false);

함수 getBeerByIdBridge(e) {
GetBeerById(this.id, 함수(맥주) {
console.log('요청한 맥주: ' beer);
});
}

빌더의 정의에 따르면 외관은 콜백입니다. 즉, 데이터를 얻은 후 표시하고 처리하는 방법은 콜백 함수에 따라 다릅니다. 따라서 콜백 함수는 데이터를 얻는 방법에 주의를 기울일 필요가 없습니다. 동일한 예 jquery의 ajax 메소드에서도 많은 콜백 함수(예: 성공, 오류 콜백 등)가 있고 주요 목적은 책임 분리임을 알 수 있습니다.

비슷한 또 다른 jQuery 예:

코드 복사 코드는 다음과 같습니다.

$('

바

');

생성할 HTML 문자만 전달하면 되며 특정 HTML 객체가 어떻게 생성되는지 걱정할 필요가 없습니다.

요약

빌더 패턴은 주로 "단계별 복잡한 개체 구축"에 사용됩니다. 여기서 "단계별"은 안정적인 알고리즘인 반면 복잡한 개체의 다양한 부분은 자주 변경됩니다. 기술"이 노출되어 빌더 모드를 더욱 유연하게 만들고, 빌더 모드에서는 조립 과정과 특정 부품 생성을 분리하여 각 부품이 어떻게 조립되는지 신경 쓸 필요가 없습니다.