🎨 06. 커맨드 패턴

🎮 만능 IOT 리모컨

이 리모컨은 프로그래밍이 가능한 7개의 슬롯과 각 슬롯에 할당된 기능을 켜고 끄는 ON/OFF 스위치가 있다. 각 슬롯은 서로 다른 가정용 기기에 연결할 수 있고, 작업 취소 버튼도 장착되어 있다.

리모컨 구조를 살펴보자

• 프로그래밍이 가능한 7개의 슬롯이 있다. 각 슬롯에 원하는 제품을 연결한 다음 옆에 있는 버튼으로 조작할 수 있다.
• 7개의 슬롯마다 ‘ON’ 버튼과 ‘OFF’ 버튼이 있다.
  • 이 두 버튼으로 각각의 슬롯에 연결된 가전제품을 제어할 수 있다.
• 마지막으로 누른 버튼의 명령을 취소하는 ‘UNDO’ 버튼도 있다.

🎮 협력 업체 클래스 살펴보기

CEO가 이메일에 첨부해서 보낸, 협력 업체 클래스를 살펴보자.

class OutdoorLight {
  on() {
    console.log("조명이 켜졌습니다");
  }

  off() {
    console.log("조명이 꺼졌습니다");
  }
}

class Stereo {
  on() {
    console.log("오디오가 켜졌습니다");
  }

  off() {
    console.log("오디오가 꺼졌습니다");
  }

  setCd() {
    console.log("CD가 재생됩니다");
  }

  setVolume(volume: number) {
    console.log(`볼륨이 ${volume}로 설정되었습니다`);
  }
}

class TV {
  on() {
    console.log("TV가 켜졌습니다");
  }

  off() {
    console.log("TV가 꺼졌습니다");
  }
  
  setInputChannel(channel: number) {
	  console.log("채널이 ${channel}번으로 설정됩니다.")
	 }
}

공통적인 인터페이스가 있지도 않을 뿐더러, 앞으로도 이런 클래스들이 더 추가될 수도 있다.

🎮 커맨드 패턴 소개

객체마을 식당에서는 주문을 처리하는 새로운 시스템을 도입했다.

기존 음식 주문 과정

• 고객이 종업원에서 주문한다.
• 종업원은 주문을 받아서 카운터에 전달하고 “주문 들어왔어요!” 라고 얘기한다.
• 주방장이 주문대로 음식을 준비한다.

객체마을 식당인 만큼 객체와 메소드를 활용해 보자.

• 고객이 원하는 것을 주문한다.
• 주문은 주문서와 그 위에 적혀 있는 주문 내용으로 구성된다.
• 종업원은 주문 처리를 준비하는 orderUp() 메소드를 호출한다.
• Order 객체에는 음식을 준비할 때 필요한 모든 지시사항이 들어있다. Order 객체가 주방장에게 makeBurger() 같은 메소드 호출로 행동을 지시한다.
• 주방장은 Order로부터 전달받은 지시사항에 따라서 음식을 준비한다.

🎮 객체마을 식당 등장인물의 역할

• 주문서는 주문 내용을 캡슐화한다.
  • 주문 내용을 요구하는 객체라고 볼 수 있다. 이 객체의 인터페이스에는 식사 준비에 필요한 행동을 캡슐화한 orderUp() 메소드가 들어있다.
• 종업원은 주문서를 받고 orderUp() 메소드를 호출한다.
  • 종업원은 주문서에 무슨 내용이 있는지, 누가 식사를 준비하는지는 전혀 알 필요가 없다. 종업원의 takeOrder() 메소드에는 여러 고객의 주문서를 매개변수로 전달한다.
• 주방장은 식사를 준비하는 데 필요한 정보를 갖고 있다.
  • 종업원이 orderUp() 메소드를 호출하면 주방장이 그 주문을 받아서 음식을 만들 때 필요한 메소드를 전부 처리한다. 여기서 주방장과 종업원은 완전히 분리되어 있다.

객체마을 식당은 객체지향 디자인 패턴의 항 모델이라고 볼 수 있다. 리모컨 API에 대입해 보면, 리모컨 버튼이 눌렸을 때 호출되는 코드와 실제로 일을 처리하는 코드를 분리해야 한다. 리모컨 슬롯에 객체마을 식당의 주문서 같은 객체가 들어있다면 어떨까?

🎮 객체마을 식당과 커맨드 패턴

• 클라이언트는 커맨드 객체를 생성해야 한다. 커맨드 객체는 리시버에 전달할 일련의 행동으로 구성된다.
• 커맨드 객체에는 행동과 리시버의 정보가 같이 들어있다.
• 커맨드 객체에서 제공하는 메소드는 execute() 하나뿐이다. 이 메소드는 행동을 캡슐화하며, 리시버에 있는 특정 행동을 처리한다.
• 클라이언트는 인보커 객체의 setCommand() 메소드를 호출하는데, 이때 커맨드 객체를 넘겨준다. 그 커맨드 객체는 나중에 쓰이기 전까지 인보커 객체에 보관된다.
• 인포커에서 커맨드 객체의 execute() 메소드를 호출하면 리시버에 있는 행동 메소드가 호출된다.

인보커 로딩

• 클라이언트에서 커맨드 객체 생성
• setCommand()를 호출해서 인보커에 커맨드 객체를 저장
• 나중에 클라이언트에서 인보커에게 그 명령을 실행하라고 요청
• 참고: 어떤 명령을 인보커에 로딩한 다음 한 번만 작업을 처리하고 커맨드 객체를 지우도록 할 수도 있고, 저장해 둔 명령을 여러 번 수행하게 할 수도 있다.

🎮 첫 번째 커맨드 객체 만들기

먼저 공통 인터페이스인 Command를 정의해 보자. 모든 커맨드 객체는 이 인터페이스를 구현한다.

interface Command {
  execute(): void
}

이제 조명을 켤 때 필요한 커맨드 클래스를 구현해 보자. 협력 업체에서 제공한 클래스를 보니 Light 클래스에는 on()과 off()라는 2개의 메소드가 있다.

class LightOnCommand implements Command {
  constructor(private light: OutdoorLight) {}

  execute() {
    this.light.on()
  }
}

생성자에 커맨드 객체로 제어할 특정 조명(’거실 조명’ 등)의 정보가 전달된다. 그 객체는 light라는 인스턴스 변수에 저장이 된다. execute() 메소드가 호출되면 light 객체가 바로 그 요청의 리시버가 된다.

execute() 메소드는 리시버 객체에 있는 on() 메소드를 호출한다.

🎮 커맨드 객체 사용하기

제어할 기기를 연결할 슬롯과 버튼이 각각 하나씩밖에 없는 리모컨에 커맨드 객체를 사용해 보자.

interface Command {
  execute(): void;
}

class SimpleRemoteControl {
  private slot: Command | null = null;

  setCommand(command: Command) {
    this.slot = command;
  }

  buttonWasPressed() {
    this.slot?.execute();
  }
}

• 커맨드를 저장할 슬롯이 1개 있다. 이 슬롯으로 1개의 기기를 제어한다.
• 슬롯을 가지고 제어할 명령을 설정하는 메소드(setCommand)
  • 리모컨 버튼의 기능을 바꾸고 싶다면 이 메소드를 사용해서 얼마든지 바꿀 수 있다.
• 버튼을 누르면 buttonWasPressed()가 호출된다. 지금 슬롯에 연결된 커맨드 객체의 execute() 메소드만 호출하면 된다.

function simpleRemoteControlTest() {
  const remoteControl = new SimpleRemoteControl(); // 인보커
  const light = new Light();                       // 리시버
  const lightOn = new LightOnCommand(light);       // 커맨드 객체

  remoteControl.setCommand(lightOn);               // 커맨드 설정
  remoteControl.buttonWasPressed();                // 커맨드 실행
}

simpleRemoteControlTest();

다음과 같은 코드를 써서 SimpleRemoteControl를 테스트해 보자.

• 리모컨 생성 (인보커): 명령을 보관하고, 실행을 요청하는 객체
• 불 만들기 (리시버): 실제 일을 수행하는 객체
• 명령서 만들기 (커맨드 객체): 리시버에게 일을 시키는 명령서 역할. execute() 메서드 안에 “무엇을 할지” 적혀 있음
• 리모컨에 명령서 꽂기 (커맨드 설정) → 버튼 누르기 (커맨드 실행)

GarageDoorOpenCommand 클래스를 만들어 차고 문을 열어 보자.

// 리시버: 실제 동작을 수행하는 클래스
class GarageDoor {
  lightOn() {
    console.log("차고 불이 켜졌습니다");
  }

  garageOpen() {
    console.log("차고 문이 열렸습니다");
  }
}

// 커맨드 인터페이스
interface Command {
  execute(): void;
}

// 커맨드 구현: 차고 문 열기
class GarageDoorOpenCommand implements Command {
  constructor(private garageDoor: GarageDoor) {}

  execute() {
    this.garageDoor.garageOpen();
  }
}

// 커맨드: 차고 불 켜기
class GarageDoorLightOnCommand implements Command {
  constructor(private garageDoor: GarageDoor) {}

  execute() {
    this.garageDoor.lightOn();
  }
}

// 인보커: 커맨드를 설정하고 실행하는 리모컨
class SimpleRemoteControl {
  private slot: Command | null = null;

  setCommand(command: Command) {
    this.slot = command;
  }

  buttonWasPressed() {
    this.slot?.execute();
  }
}

function garageTest() {
  const remote = new SimpleRemoteControl();       // 인보커
  const garageDoor = new GarageDoor();            // 리시버

  const openCommand = new GarageDoorOpenCommand(garageDoor);      // 커맨드: 문 열기
  const lightOnCommand = new GarageDoorLightOnCommand(garageDoor); // 커맨드: 불 켜기

  // 차고 문 열기
  remote.setCommand(openCommand);
  remote.buttonWasPressed(); // 출력: 차고 문이 열렸습니다

  // 차고 불 켜기
  remote.setCommand(lightOnCommand);
  remote.buttonWasPressed(); // 출력: 차고 불이 켜졌습니다
}

garageTest();

🎮 커맨드 패턴의 정의

커맨드 패턴(Command Pattern)을 사용하면 요청 내역을 객체로 캡슐화해서 객체를 서로 다른 요청 내역에 따라 매개변수화할 수 있다. 이러면 요청을 큐에 저장하거나 로그로 기록하거나 작업 취소 기능을 사용할 수 있다.

커맨드 객체는 일련의 행동을 특정 리시버와 연결시킴으로써 요구 사항을 캡슐화한 것이다.

이러려면 행동과 리시버를 한 객체에 집어넣고 execute()라는 메소드 하나만 외부에 공개하는 방법을 써야 한다. 이 메소드 호출에 의해서 리시버에서 일련의 작업이 처리된다. 밖에서 볼 때는 어떤 객체가 리시버 역할을 하는지, 그 리시버에서 실제로 어떤 일을 하는지 알 수 없다. execute() 메소드를 호출하면 요구 사항이 처리된다는 것만 알 수 있을 뿐이다.

명령으로 객체를 매개변수화하는 몇 가지 사례도 볼 수 있다.

객체마을 식당에서는 종업원이 여러 개의 주문서로 매개변수화되는 것을 볼 수 있었고, 간단한 리모컨 예제에서는 버튼 슬롯에 ‘조명 켜기’ 명령을 로딩했다가 나중에 ‘차고 문 열기’ 명령을 로딩하기도 했다.

아직 커맨드 객체를 써서 큐와 로그를 구현하거나 작업 취소를 하는 방법은 배우지 못했다. 하지만 기본적인 커맨드 패턴을 조금만 확장하면 된다. 그리고 기본적인 커맨드 패턴을 제대로 사용할 수 있다면 메타 커맨드 패턴(Meta Command Partten)도 그리 어렵지 않게 구현할 수 있다. 메타 커맨드 패턴을 사용하면 여러 개의 명령을 매크로로 한 번에 실행할 수 있다.

🎮 커맨드 패턴 클래스 다이어그램 살펴보기

• Client (클라이언트)
  • 실제 명령을 만들고 리시버를 설정하는 역할을 한다.
  • 예: “불 켜기” 명령을 만들고, 어떤 조명을 켤지 지정한다.
• Command (명령 인터페이스)
  • 모든 명령이 따라야 하는 공통 인터페이스다.
  • 보통 execute() 메서드만 가진다.
• ConcreteCommand (구체 명령 객체)
  • 실제 명령 내용이 들어 있는 클래스다.
  • 리시버를 가지고 있고, execute() 안에서 리시버의 메서드를 호출한다.
  • 예: this.light.on()처럼 실제 동작을 수행한다.
• Receiver (리시버)
  • 실제 일을 수행하는 객체다.
  • 명령 객체에서 이 리시버의 메서드를 호출한다.
  • 예: Light, GarageDoor 등
• Invoker (인보커)
  • 명령을 받아 저장하고 있다가, 필요할 때 execute()를 호출하는 역할을 한다.
  • 예: 리모컨, 버튼

커맨드 패턴을 사용하면 작업을 요구한 인보커와 작업을 처리하는 리시버가 어떻게 분리되는 걸까?

구조에 따른 역할 분리

구성 요소	역할	알거나 모르는 것
Invoker (예: 리모컨)	명령을 저장하고, 실행시 execute()만 호출	리시버가 뭔지, 실제 행동이 뭔지 모름
Command (명령서)	리시버와 행동을 내부에 담고 있음	execute() 안에서 리시버의 메서드 호출
Receiver (예: 조명, TV)	진짜로 일을 수행하는 객체	실제 행동을 구현

remote.setCommand(lightOnCommand); // remote는 그게 뭔지 모름
remote.buttonWasPressed(); // 내부적으로 light.on() 실행됨

• remote(인보커)는 그냥 execute()만 호출
• lightOnCommand(커맨드 객체)는 내부적으로 light.on() 호출
• light(리시버)가 실제로 불을 켠다

왜 이게 좋을까?

• 인보커는 모듈화, 재사용 가능
• 리시버는 동작에만 집중
• 커맨드를 바꿔 끼우면 동작을 유연하게 변경 가능

즉, 커맨드 패턴은 중간에 명령 객체를 끼워 넣어 “누가 명령했고, 누가 수행하는지”를 느슨하게 연결하는 게 핵심이다.

🎮 슬롯에 명령 할당하기

• 각 슬롯마다 커맨드 객체가 할당된다.
• 사용자가 버튼을 누르면 해당 커맨드 객체의 execute() 메소드가 호출된다.
• execute() 메소드에서는 리시버로 하여금 특정 작업을 처리하도록 지시한다.

🎮 리모컨 코드 만들기

// 커맨드 인터페이스
interface Command {
  execute(): void;
}

// 아무 동작도 하지 않는 기본 커맨드 (Null Object 패턴)
class NoCommand implements Command {
  execute() {
    // 아무 일도 하지 않음
  }
}

// 인보커 역할의 리모컨 클래스
class RemoteControl {
  private static readonly SLOT_SIZE = 7; // 슬롯 개수: 7개
  private onCommands: Command[];         // 각 슬롯의 ON 커맨드 배열
  private offCommands: Command[];        // 각 슬롯의 OFF 커맨드 배열

  constructor() {
    const noCommand = new NoCommand(); // 기본값으로 넣을 명령

    // 모든 슬롯을 NoCommand로 초기화
    this.onCommands = new Array(RemoteControl.SLOT_SIZE).fill(noCommand);
    this.offCommands = new Array(RemoteControl.SLOT_SIZE).fill(noCommand);
  }

  // 슬롯 번호에 ON/OFF 명령을 등록하는 메서드
  setCommand(slot: number, onCommand: Command, offCommand: Command) {
    this.onCommands[slot] = onCommand;
    this.offCommands[slot] = offCommand;
  }

  // ON 버튼 눌렀을 때 실행되는 메서드
  onButtonWasPushed(slot: number) {
    this.onCommands[slot].execute();
  }

  // OFF 버튼 눌렀을 때 실행되는 메서드
  offButtonWasPushed(slot: number) {
    this.offCommands[slot].execute();
  }

  // 현재 리모컨에 설정된 명령 목록을 문자열로 출력
  toString(): string {
    let result = "\n------ Remote Control -------\n";
    for (let i = 0; i < RemoteControl.SLOT_SIZE; i++) {
      result += `[slot ${i}] ${this.onCommands[i].constructor.name}    ${this.offCommands[i].constructor.name}\n`;
    }
    return result;
  }
}

• 전체 슬롯 수는 7개로 고정되어 있다.
• on, off 명령을 각각 배열로 저장한다.
• 초기에는 모든 슬롯에 아무 동작도 하지 않는 NoCommand 객체를 넣어둔다
• setCommand로 특정 슬롯에 on과 off 명령을 설정할 수 있다
• onButtonWasPushed는 해당 슬롯의 on 명령을 실행한다
• offButtonWasPushed는 해당 슬롯의 off 명령을 실행한다
• toString 메서드는 현재 슬롯에 어떤 명령들이 들어있는지 문자열로 출력한다

🎮 커맨드 클래스 만들기

앞에서 SimpleRemoteControl을 만들 때 LightOnCommand라는 커맨드 클래스를 만든 적이 있다. 그 코드를 여기에 그대로 쓸 수 있다. 조명을 끌 때 쓰는 LightOffCommand라는 커맨드 클래스도 다음과 같은 방식으로 만들면 된다.

class LightOffCommand implements Command {
  constructor(private light: OutdoorLight) {}

  execute() {
    this.light.off()
  }
}

오디오를 켜고 끌 때 사용할 커맨드 클래스를 만들어 보자. 끄는 건 off() 메소드와 연결해 주면 되지만, 켜는 건 조금 더 어렵다. 일단 오디오를 켤 때 자동으로 CD가 재생되도록 하는 stereoOnWithCDCommand 클래스를 만들어 보자.

class StereoOnWithCDCommand implements Command {
  constructor(private stereo: Stereo) {}

  execute() {
    this.stereo.on();
    this.stereo.setCd();
    this.stereo.setVolume(11);
  }
}

🎮 리모컨 테스트

function RemoteLoader() {
  const remoteControl = new RemoteControl();

  const livingRoomLight = new Light("거실");
  const kitchenLight = new Light("주방");
  const ceilingFan = new CeilingFan("거실");
  const garageDoor = new GarageDoor("차고");
  const stereo = new Stereo("거실");

  const livingRoomLightOn = new LightOnCommand(livingRoomLight);
  const livingRoomLightOff = new LightOffCommand(livingRoomLight);
  const kitchenLightOn = new LightOnCommand(kitchenLight);
  const kitchenLightOff = new LightOffCommand(kitchenLight);

  const ceilingFanOn = new CeilingFanOnCommand(ceilingFan);
  const ceilingFanOff = new CeilingFanOffCommand(ceilingFan);

  const garageDoorUp = new GarageDoorUpCommand(garageDoor);
  const garageDoorDown = new GarageDoorDownCommand(garageDoor);

  const stereoOnWithCD = new StereoOnWithCDCommand(stereo);
  const stereoOff = new StereoOffCommand(stereo);

  remoteControl.setCommand(0, livingRoomLightOn, livingRoomLightOff);
  remoteControl.setCommand(1, kitchenLightOn, kitchenLightOff);
  remoteControl.setCommand(2, ceilingFanOn, ceilingFanOff);
  remoteControl.setCommand(3, stereoOnWithCD, stereoOff);

  console.log(remoteControl.toString());

  remoteControl.onButtonWasPushed(0);
  remoteControl.offButtonWasPushed(0);
  remoteControl.onButtonWasPushed(1);
  remoteControl.offButtonWasPushed(1);
  remoteControl.onButtonWasPushed(2);
  remoteControl.offButtonWasPushed(2);
  remoteControl.onButtonWasPushed(3);
  remoteControl.offButtonWasPushed(3);
}

RemoteLoader();

4번부터 6번 슬롯까지는 NoCommand라고 나오는데 그건 뭘까?

• NoCommand 객체
  • NoCommand 객체는 일종의 널 객체이다. 딱히 리턴할 객체는 없지만 클라이언트 쪽에서 null을 처리하지 않아도 되도록 하고 싶을 때 널 객체를 활용하면 좋다. 특정 슬롯을 쓰려고 할 때 마다 거기에 뭔가가 로딩되어 있는지 확인하려면 좀 귀찮기 때문이다.

🎮 API 문서 만들기

• Command
  • 모든 RemoteControl 클래스용 커맨드 객체는 Command를 구현해야 한다.
  • 커맨드 객체는 일련의 행동을 캡슐화하며, 리모콘은 해당 행동을 execute(), undo()를 통해 호출한다.
• LightOnCommand, LightOffCommand
  • 리모콘을 눌렀을때 호출되는 행동이다. Command 인터페이스를 구현한 커맨드 객체로 구현된다.
  • 커맨드 객체에는 업체에서 제공한 클래스 인스턴스의 레퍼런스가 존재하여, execute()-undo()로 구현되어 있다.
• RemoteControl
  • 버튼마다 하나의 커맨드 객체를 할당해서 관리한다.
  • 버튼이 눌리면 버튼에 해당하는 ButtonWasPushed()가 호출되어 execute()를 호출한다.
• Light
  • 협력업체가 제공한 클래스로, Light 클래스를 예로 들었습니다.
• RemoteLoader
  • 리모콘 슬롯에 로딩되는 일련의 커맨드 객체를 생성한다.
  • 각 커맨드 객체에는 홈 오토메이션 장치로 전송되는 요청이 캡슐화되어 있다.

🎮 작업 취소 기능 추가하기

리모컨에 작업을 취소하는 UNDO 버튼을 추가해야 한다. 더 복잡한 예를 살펴보기 전에 우선 조명 작업 취소 기능을 추가해 보자.

interface Command {
  execute(): void;
  undo(): void;
}

class LightOnCommand implements Command {
  constructor(private light: Light) {}

  execute() {
    this.light.on();
  }

  undo() {
    this.light.off(); // 이전 상태로 되돌리기
  }
}

class LightOffCommand implements Command {
  constructor(private light: Light) {}

  execute() {
    this.light.off();
  }

  undo() {
    this.light.on(); // 이전 상태로 되돌리기
  }
}

class RemoteControl {
  private static readonly SLOT_SIZE = 7;
  private onCommands: Command[];
  private offCommands: Command[];
  private undoCommand: Command;

  constructor() {
    const noCommand = new NoCommand();
    this.onCommands = new Array(RemoteControl.SLOT_SIZE).fill(noCommand);
    this.offCommands = new Array(RemoteControl.SLOT_SIZE).fill(noCommand);
    this.undoCommand = noCommand;
  }

  setCommand(slot: number, onCommand: Command, offCommand: Command) {
    this.onCommands[slot] = onCommand;
    this.offCommands[slot] = offCommand;
  }

  onButtonWasPushed(slot: number) {
    this.onCommands[slot].execute();
    this.undoCommand = this.onCommands[slot];
  }

  offButtonWasPushed(slot: number) {
    this.offCommands[slot].execute();
    this.undoCommand = this.offCommands[slot];
  }

  undoButtonWasPushed() {
    this.undoCommand.undo();
  }
}

🎮 작업 취소 기능을 구현할 때 상태를 사용하는 방법

Light 클래스의 작업 취소 기능을 배웠는데, 작업 취소 기능을 구현하다 보면 간단한 상태를 저장해야 하는 상황도 종종 생긴다. 선풍기 제조 업체에서 제공한 CeilingFan 클래스로 간단한 상태를 저장해 보자. 선풍기는 속도를 선택할 수 있다는 사실을 알아두자.

class CeilingFan {
  static readonly HIGH = 3;
  static readonly MEDIUM = 2;
  static readonly LOW = 1;
  static readonly OFF = 0;

  private speed: number;
  
  constructor(private location: string) {
    this.speed = CeilingFan.OFF;
  }

  high() {
    this.speed = CeilingFan.HIGH;
    console.log(`${this.location} ceiling fan is on high`);
  }

  medium() {
    this.speed = CeilingFan.MEDIUM;
    console.log(`${this.location} ceiling fan is on medium`);
  }

  low() {
    this.speed = CeilingFan.LOW;
    console.log(`${this.location} ceiling fan is on low`);
  }

  off() {
    this.speed = CeilingFan.OFF;
    console.log(`${this.location} ceiling fan is off`);
  }

  getSpeed(): number {
    return this.speed;
  }
}

🎮 선풍기 명령어에 작업 취소 기능 추가하기

class CeilingFanHighCommand implements Command {
  private prevSpeed: number;

  constructor(private ceilingFan: CeilingFan) {
    this.prevSpeed = CeilingFan.OFF;
  }

  execute() {
    this.prevSpeed = this.ceilingFan.getSpeed(); // 실행 전 상태 저장
    this.ceilingFan.high();                      // 현재 행동 실행
  }

  undo() {
    // 이전 속도 상태로 되돌리기
    switch (this.prevSpeed) {
      case CeilingFan.HIGH:
        this.ceilingFan.high();
        break;
      case CeilingFan.MEDIUM:
        this.ceilingFan.medium();
        break;
      case CeilingFan.LOW:
        this.ceilingFan.low();
        break;
      default:
        this.ceilingFan.off();
    }
  }
}

🎮 선풍기 테스트 코드 만들기

리모컨에 선풍기용 커맨드 객체를 넣어 테스트해 볼 때가 되었다. 0번 슬롯의 ON 버튼에 선풍기 속도를 MEDIUM으로 설정하는 기능을, 1번 슬롯의 ON 버튼에 선풍기 속도를 HIGH로 설정하는 기능을 할당할 것이다. OFF 버튼에는 속도를 OFF로 설정하는 기능을 할당할 것이다.

function RemoteLoader() {
  const remoteControl = new RemoteControl();         // 인보커
  const ceilingFan = new CeilingFan("거실");          // 리시버

  // 커맨드 객체 생성
  const ceilingFanMedium = new CeilingFanMediumCommand(ceilingFan);
  const ceilingFanHigh = new CeilingFanHighCommand(ceilingFan);
  const ceilingFanOff = new CeilingFanOffCommand(ceilingFan);

  // 슬롯 설정
  remoteControl.setCommand(0, ceilingFanMedium, ceilingFanOff); // 0번 슬롯: MEDIUM ↔ OFF
  remoteControl.setCommand(1, ceilingFanHigh, ceilingFanOff);   // 1번 슬롯: HIGH ↔ OFF

  // 테스트 시나리오
  remoteControl.onButtonWasPushed(0);  // 거실 선풍기 MEDIUM 설정
  remoteControl.offButtonWasPushed(0); // 거실 선풍기 OFF
  remoteControl.undoButtonWasPushed(); // 이전 상태(MEDIUM) 복원

  remoteControl.onButtonWasPushed(1);  // 거실 선풍기 HIGH 설정
  remoteControl.undoButtonWasPushed(); // 이전 상태(OFF) 복원
}

🎮 여러 동작을 한 번에 처리하기

버튼 한 개만 누르면 조명이 어두어줘지면서 오디오와 TV가 켜지고, DVD 모드로 변경되고, 욕조에 물이 채워지는 것까지 한 번에 처리하는 기능이 있어야 진정한 리모컨이라고 할 수 있지 않을까?

class MacroCommand implements Command {
  constructor(private commands: Command[]) {}

  execute() {
    for (const command of this.commands) {
      command.execute();
    }
  }

  undo() {
    // 역순으로 undo 실행
    for (let i = this.commands.length - 1; i >= 0; i--) {
      this.commands[i].undo();
    }
  }
}

🎮 매크로 커맨드 사용하기

function RemoteLoader() {
  const remoteControl = new RemoteControl(); // 인보커

  const light = new Light("Living Room");    // 리시버 1
  const stereo = new Stereo("Living Room");  // 리시버 2

  const lightOnCommand = new LightOnCommand(light);
  const lightOffCommand = new LightOffCommand(light);
  const stereoOnCommand = new StereoOnWithCDCommand(stereo);
  const stereoOffCommand = new StereoOffCommand(stereo);

  const partyOn: Command[] = [lightOnCommand, stereoOnCommand];
  const partyOff: Command[] = [lightOffCommand, stereoOffCommand];

  const partyOnMacro = new MacroCommand(partyOn);
  const partyOffMacro = new MacroCommand(partyOff);

  remoteControl.setCommand(0, partyOnMacro, partyOffMacro);

  console.log(remoteControl.toString());

  console.log("---- macro on ------");
  remoteControl.onButtonWasPushed(0);

  console.log("---- macro off ------");
  remoteControl.offButtonWasPushed(0);
}

------ Remote Control -------
[slot 0] MacroCommand    MacroCommand
[slot 1] NoCommand    NoCommand
[slot 2] NoCommand    NoCommand
[slot 3] NoCommand    NoCommand
[slot 4] NoCommand    NoCommand
[slot 5] NoCommand    NoCommand
[slot 6] NoCommand    NoCommand
---- macro on ------
Living Room light is on
Living Room stereo is on
CD가 재생됩니다
볼륨이 11로 설정되었습니다
---- macro off ------
Living Room light is off
Living Room stereo is off

1. 커맨드 객체는 항상 리시버가 필요할까?
   • 꼭 그런 건 아니다. 커맨드 객체 자체에서 실행 로직을 처리하는 ‘스마트 커맨드’ 를 만들 수도 있다.
   • 하지만 일반적으로는 리시버에 있는 행동을 단순히 호출하는 ‘더미 커맨드’ 를 사용한다.
   • 이유는 명령과 실제 작업을 분리하고, 인보커와 리시버를 느슨하게 연결하기 위해서다.
   • 커맨드 안에서 다 처리하면 나중에 유연성과 재사용성이 떨어질 수 있다.
2. Undo(작업 취소)를 여러 번 가능하게 하려면?
   • 단순히 마지막 커맨드 하나만 기억하는 대신, 실행한 커맨드들을 스택에 쌓아두면 된다.
   • 사용자가 Undo 버튼을 누를 때마다 스택에서 가장 최근 커맨드를 꺼내서 undo()를 호출하면 된다.
   • 즉, 히스토리 스택을 이용해 여러 단계 undo를 구현할 수 있다.
3. 파티 모드 같은 매크로 기능을 직접 구현해도 될까?
   • 물론 가능하지만, PartyCommand 안에 모든 코드를 직접 넣는 방식은 유연성이 떨어진다.
   • 대신 MacroCommand를 사용하면 여러 커맨드를 묶어서 실행할 수 있고,
   • 나중에 변경이나 확장할 때도 더 깔끔하게 처리할 수 있다.
   • 결론: 직접 처리보다 MacroCommand 방식이 확장성과 유지보수 측면에서 훨씬 낫다.

🎮 커맨드 패턴 활용하기

커맨드 패턴을 활용하면 컴퓨테이션의 일부분(리시버 + 행동) 을 하나의 객체로 캡슐화해서, 그 객체를 일급 객체처럼 전달하거나 나중에 실행하는 방식으로 사용할 수 있다.

즉, 클라이언트에서 커맨드 객체를 만들어 놓고 오랜 시간이 지난 후에도 실행할 수 있으며, 다른 스레드에서 실행하는 것도 가능하다.

이러한 특성을 활용하면 커맨드 패턴을 스케줄러, 스레드 풀, 작업 큐 같은 구조에 적용할 수 있다.

작업 큐 구조 예시

1. 커맨드 인터페이스를 구현하는 객체를 큐에 넣는다.
2. 큐의 한쪽 끝에는 작업을 등록하는 코드가 있고,
3. 반대쪽 끝에는 작업을 처리하는 스레드들이 대기 중이다.
4. 스레드는 큐에서 커맨드 객체를 꺼낸 후, execute() 메서드를 호출한다.
5. 작업이 끝나면 해당 커맨드 객체는 버려지고, 다음 커맨드를 처리한다.

왜 이 구조가 유용할까?

• 작업 큐는 실제 작업 내용(계산, 다운로드 등)을 알 필요가 없다.
• 그저 커맨드 객체만 큐에 들어오면 스레드가 알아서 처리해준다.
• 예를 들어, 한 스레드가 금융 계산을 하다가, 다음엔 파일을 다운로드할 수도 있다.

• 작업 큐는 오직 커맨드 객체의 execute()만 호출할 뿐이므로,

  작업의 종류에 전혀 의존하지 않는 느슨한 구조를 유지할 수 있다.

요약

• 커맨드 객체는 작업 단위를 추상화한 객체이다.
• 이 객체를 큐에 담고, 나중에 필요할 때 실행할 수 있다.
• 이런 구조는 비동기 처리, 스레드 분리, 유연한 작업 관리 등에 매우 효과적이다.

🎮 커맨드 패턴 더 활용하기

일부 애플리케이션은 사용자의 모든 행동을 기록해두었다가, 앱이 중단되거나 시스템이 다운되었을 때 이를 다시 실행해 복구해야 하는 경우가 있다.

이때 커맨드 패턴을 활용하면 행동 하나하나를 객체로 저장하고, 필요할 때 다시 실행 (execute()) 할 수 있기 때문에 복구 시스템을 구현하기에 적합하다.

커맨드 패턴을 활용한 로그 기록 구조

• 명령을 실행할 때마다 해당 커맨드 객체를 디스크에 저장한다.

• 애플리케이션이 종료되거나 다운된 후 재시작되면,

  저장된 커맨드를 다시 불러와 execute()를 순서대로 실행한다.

• 이 방식으로 시스템을 마지막 체크포인트 이후 상태로 복원할 수 있다.

Java에서는 커맨드 객체를 직렬화해 저장할 수도 있지만, 직렬화는 제약이 많고 유연성이 떨어질 수 있다.

예외: 단순한 리모컨에는 불필요한 기능

• 리모컨 예제처럼 단순한 상태 조작만 있는 경우엔 로그 기록이 큰 의미가 없다.
• 하지만 대용량 데이터를 다루거나, 중간 저장이 어려운 애플리케이션에는 매우 유용하다.

예시: 스프레드시트 애플리케이션

• 매번 데이터를 저장하지 않고,
• 특정 체크포인트 이후의 모든 사용자 작업을 커맨드 객체로 기록한다.
• 복구 시, 기록된 커맨드를 다시 실행하면 체크포인트 이후의 상태를 되살릴 수 있다.

확장 가능성: 트랜잭션 적용

• 더 복잡한 애플리케이션에서는 이 구조를 트랜잭션 단위로 묶어,
  • 모든 작업이 완전히 적용되거나
  • 전부 취소(rollback) 되도록 만들 수도 있다.
• 즉, 커맨드 패턴은 로그 시스템 + 트랜잭션 관리 기반이 될 수 있다.

🎮 실전 적용! 커맨드 패턴

// 커맨드 인터페이스 역할: 이벤트 핸들러
interface ActionListener {
  actionPerformed(event: Event): void;
}

// 구상 커맨드 1
class AngelListener implements ActionListener {
  actionPerformed(event: Event): void {
    console.log("하지마!");
  }
}

// 구상 커맨드 2
class DevilListener implements ActionListener {
  actionPerformed(event: Event): void {
    console.log("해!");
  }
}

// 클라이언트 역할
function SwingObserverEx() {
  const button = document.getElementById("actionButton");

  if (!button) return;

  const angelListener = new AngelListener();
  const devilListener = new DevilListener();

  // 인보커 역할: 버튼 이벤트에 커맨드 등록
  button.addEventListener("click", (e) => {
    angelListener.actionPerformed(e);
    devilListener.actionPerformed(e);
  });
}

// 실행
SwingObserverEx();

Reference

https://velog.io/@toma/헤드-퍼스트-디자인-패턴-6장-커맨드-패턴-in-Swift

https://velog.io/@ljo_0920/디자인-패턴-커맨드-패턴

https://faun.pub/head-first-design-patterns-using-go-5-encapsulating-invocation-the-command-pattern-2f8c0a79d1c7

https://greensky0026.tistory.com/278#google_vignette