중재자 패턴의 기능은 객체 간의 단단한 커플 링 관계를 분리하는 것인데, 이는 '중재자'라고도합니다. 모든 객체는 서로를 참조하기보다는 중개 객체를 통해 통신하므로 객체가 변경되면 중개자에게만 알리면됩니다.
예를 들어, 공항의 지휘관, 각 항공기는 명령 타워와 통신하면됩니다. 명령 타워는 각 항공기의 비행 상태를 알고 있으며 모든 이륙 및 착륙 시간, 경로 조정 등을 정리할 수 있습니다.
중개 모델은 Dimitian 법칙, 즉 최소 지식의 원리를 준수하며, 이는 물체가 다른 대상에 대해 가능한 한 적은 것을 알아야 함을 의미합니다. 물체 사이의 커플 링이 너무 높으면 물체를 변경하면 많은 물체에 영향을 미치고 유지하기가 어렵습니다. 물체 커플 링이 단단 해지면 다른 물체에 영향을 미치지 않고 한 객체를 수정하기가 어렵습니다.
객체 사이의 복잡한 커플 링이 호출 및 유지에 어려움을 겪고 프로젝트의 변화에 따라 이러한 커플 링도가 기하 급수적으로 증가한다면, 우리는 중개자 패턴으로 코드를 리팩토링하는 것을 고려할 수 있습니다! 중재자는 분리를 통한 코드의 유지 관리 가능성을 향상시킵니다.
예 1 : 게임
플레이어 객체는 Player () 생성자를 통해 생성되며 고유 한 지점과 이름 속성이 있습니다. 프로토 타입의 Play () 메소드는 포인트 자체를 추가하고 중개자에게 알리는 역할을합니다.
함수 플레이어 (이름) {this.points = 0; this.name = name;} player.prototype.play = function () {this.points += 1; Mediator.played ();};스코어 보드 개체 (스코어 보드)에는 update () 메소드가 있으며, 각 플레이어가 재생을 마친 후 중개자가 호출합니다. 분석은 플레이어에 대한 정보를 전혀 알지 못하거나 점수를 절약하지도 않습니다. 중개자가 제공 한 점수를 표시 할 책임이 있습니다.
var scoreboard = {요소 : document.getElementById ( 'results'), 업데이트 : 함수 (score) {var i, msg = ''; for (i in score) {if (score.hasownproperty (i)) {msg + = '<p> <strong>' + i + '<// strong> :'; msg += 점수 [i]; msg += '<// p>'; }} this.element.innerhtml = msg; }};이제 중재자 개체 (중재자)를 살펴 보겠습니다. 게임이 초기화되면 setup () 메소드에서 플레이어를 생성 한 다음 플레이어 속성을 후속 사용하도록합니다. 재생 () 메소드는 각 라운드 후에 플레이어가 호출합니다. 점수 해시 테이블을 업데이트 한 다음 디스플레이를 위해 스코어 보드로 전달합니다. 마지막 방법은 키보드 이벤트를 처리하는 keypress ()입니다.
var mediator = {players : {}, setup : function () {var players = this.players; players.home = 새로운 플레이어 ( '홈'); players.guest = 새로운 플레이어 ( '게스트'); }, 재생 : function () {var players = this.players, mac 스코어 보드 .update (스코어); }, keypress : function (e) {e = e || Window.event; // if (e.which === 49) {// key "1"Mediator.Players.home.play (); 반품; } if (e.which === 48) {// key "0"Mediator.Players.guest.Play (); 반품; }}};마지막은 게임을 초기화하고 끝내는 것입니다.
// go! mediator.setup (); window.onkeypress = mediator.keypress; 30 Sec
예 2 : 휴대 전화 판매
var goods = {// 재고 '빨간색 | 32g': 3, '빨간색 | 16g': 5, 'blue | 32g': 3, 'blue | 16g': 6} // intermediator var mediator = () {return document.getElementById (id);} var colorselect = id ( 'colorselect') id ( 'numberInfo'), colorInfo = id ( 'colorInfo'), memoryInfo = id ( 'memoryInfo'), numberInfo = id ( 'numberInfo'), nextbtn = id ( 'nextBtn'); goods+'|'+memory] {colorInfo.innerhtml =} (obj === memorySelect) {memoryInfo.innerHtml; 숫자는 (! NextBytn.innerhtml = 'repired. mediator.changed (this);} numberInput.onchange = function () {mediator.changed (this);}참고 문헌 : "JavaScript Pattern" "JavaScript 디자인 패턴 및 개발 실습"
위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.