게시글

5만명이 선택한 평균 별점 4.9의 제로초 프로그래밍 강좌! 로드맵만 따라오면 됩니다! 클릭
강좌41 - JavaScript - 8년 전 등록

디자인 패턴(퍼사드, facade)

안녕하세요. 이번 시간에는 퍼사드 패턴에 대해 알아보겠습니다. 퍼사드는 외관이라는 뜻인데 다른 패턴과는 달리 번역하지 않고 그대로 쓰이더라고요. 저도 그냥 따라서 쓰겠습니다. 외관이라는 이름답게 겉만 볼 수 있습니다. 속은 보이지 않죠. 복잡한 것들, 세부적인 것들은 감추고, 간단한 것만 보여주는 패턴입니다.

전 시간에 갈바는 군단 편제를 마쳤습니다. 이제 로마로 진격합니다! 갈바 아래에는 세 개의 군단이, 그 아래에는 30개의 대대, 180개의 중대, 1800개의 분대가 있습니다. 황제인 갈바가 모든 분대에 지휘를 각각 내릴까요? 아니겠죠? 큰 틀의 지휘를 하면 군단장들이 명령을 받고, 다시 그 명령을 대대장들이 받고 이렇게 내려갈 겁니다.

실제 대부분의 프로그램들이 그렇습니다. 사용자는 간단한 명령을 하면 복잡한 것들을 내부적으로 알아서 처리하는 거죠. 어떤 방식이든 상관없이 사용자가 원하는 대로 수행만 하는 겁니다. 코드를 볼까요?

var Galba = (function() {
  function Galba() {
    this.legions = [];
    this.legions.push(new Legion(1));
    this.legions.push(new Legion(2));
    this.legions.push(new Legion(3));
  }
  Galba.prototype.march = function() {
    this.legions.forEach(function(legion) {
      legion.supply();
      legion.makeFormation();
      legion.goForward();
    });
  };
  Galba.prototype.attack = function() {
    this.legions.forEach(function(legion) {
      legion.makeFormation();
      legion.pullOutSword();
      legion.runToEnemy();
    });
  };
  Galba.prototype.halt = function() {
    this.legions.forEach(function(legion) {
      legion.halt();
    });
  };
  Galba.prototype.retreat = function() {
    this.legions.forEach(function(legion) {
      legion.retreat();
    });
  };
  return Galba;
})();
var Legion = (function() {
  function Legion(number) {
    this.number = number;
  };
  Legion.prototype.supply = function() {
  };
  Legion.prototype.makeFormation = function() {
  };
  Legion.prototype.goForward = function() {
  };
  Legion.prototype.pullOutSword = function() {
  };
  Legion.prototype.runToEnemy = function() {
  };
  Legion.prototype.halt = function() {
  };
  Legion.prototype.retreat = function() {
  };
  return Legion;
})();
var galba = new Galba();
galba.march();
galba.attack();

코드를 보면 Legion이 Galba에 비해 훨씬 더 복잡합니다. (구현은 하지 않았지만 메소드가 훨씬 더 많습니다.) 그리고 Galba는 여러 개의 군단을 동시에 통솔하고 있고요. Legion 안에는 대대를 조작하는 메소드가 있을 겁니다. Galba는 사용자와 같습니다. 그냥 간단하게 march(진군), attack(공격), halt(정지), retreat(후퇴) 메소드를 호출하면 내부적으로 하위 시스템(Legion)이 알아서 처리하는 겁니다.

갈바는 그냥 군단장들에게 '공격하라!' 라고 했을 겁니다. 그 다음은 군단장들이 정해진 전술 전략(알고리즘)에 따라서 알아서 하는 거고요. 이렇게 갈바는 로마를 공격하기 시작합니다. 네로는 갈바에게 죽임을 당하기 전에 스스로 목숨을 끊습니다.

위와 같이 프로그래밍을 잘 모르는 사용자에게는 최소한의 API만 공개하는 게 좋습니다. 이렇게 일부만 노출하는 패턴을 퍼사드 패턴이라고 합니다. 사실 대부분의 프로그래머가 사용하고 있는 것이기도 합니다. 다음 시간에는 프록시 패턴에 대해 알아보겠습니다!

조회수:
0
목록
투표로 게시글에 관해 피드백을 해주시면 게시글 수정 시 반영됩니다. 오류가 있다면 어떤 부분에 오류가 있는지도 알려주세요! 잘못된 정보가 퍼져나가지 않도록 도와주세요.
Copyright 2016- . 무단 전재 및 재배포 금지. 출처 표기 시 인용 가능.
5만명이 선택한 평균 별점 4.9의 제로초 프로그래밍 강좌! 로드맵만 따라오면 됩니다! 클릭

댓글

3개의 댓글이 있습니다.
6년 전
Galba부분에서
아래처럼 하는 것과
this.legions = [new Legion(1), new Legion(2), new Legion(3)];
아래처럼 하는 건 어떤 차이가 있나요?
this.legions = [];
this.legions.push(new Legion(1));
this.legions.push(new Legion(2));
this.legions.push(new Legion(3));
6년 전
결과적으로는 차이가 없습니다. 하나씩 추가한다는 것을 나타내기 위함입니다
6년 전
아하! 감사합니다
6년 전
ㅋㅋㅋ비유가 꿀잼이네요ㅋㅋ 예제 코드 따라치는것도 재미있어요! 디자인패턴 이해하기 좀 어려웠는데...! 좋은 글 올려주셔서 감사함당!ㅎㅎ
6년 전
감사합니다 ㅎㅎ 재밌게 봐주세요
8년 전
쉬운 설명 감사합니다 ㅎ
8년 전
더 노력하겠습니다!