커맨드 패턴 소개
커맨드 패턴은 행위 패턴 중 하나로, 요청을 객체의 형태로 캡슐화하여 매개변수를 사용자에 맞게 선택하거나 저장하고, 나중에 실행하거나 취소할 수 있게 하는 패턴입니다.
커맨드 패턴은 요청, 수신자, 호출자로 이루어져 있습니다. 요청은 수신자에 대한 작업을 캡슐화하고 호출자는 작업을 처리할 명령을 알고 있습니다.
캡슐화를 통해 호출자는 수신자에 대해 자세히 알 필요가 없으며, 나중에 취소 기능을 추가하거나 큐에 담아 실행시키는 등의 유연한 작업이 가능합니다.
커맨드 패턴의 활용 사례
커맨드 패턴은 주로 메뉴 항목, 버튼, 툴바 버튼 등 사용자 인터페이스에서 사용됩니다. 또한, 트랜잭션을 구현하거나 작업을 지연시키는 경우에도 활용됩니다.
간단한 사칙연산기를 예로 들면, 사용자가 ‘+’, ‘-‘, ‘*’, ‘/’ 버튼을 클릭했을 때, 각각의 연산을 수행하는 커맨드 객체를 생성하여 실행시킬 수 있습니다.
타입스크립트와 함께하는 커맨드 패턴
타입스크립트는 정적 타입 지정이 가능한 자바스크립트로, 커맨드 패턴을 적용할 경우 강력한 타입 지원을 받을 수 있습니다.
interface Command {
execute(): void;
undo(): void;
}
class AddCommand implements Command {
private receiver: Receiver;
private value: number;
constructor(receiver: Receiver, value: number) {
this.receiver = receiver;
this.value = value;
}
execute(): void {
this.receiver.addValue(this.value);
}
undo(): void {
this.receiver.subtractValue(this.value);
}
}
class Receiver {
private value: number = 0;
addValue(value: number) {
this.value += value;
}
subtractValue(value: number) {
this.value -= value;
}
}
class Invoker {
private commands: Command[] = [];
storeAndExecute(command: Command) {
this.commands.push(command);
command.execute();
}
undoLastCommand() {
const command = this.commands.pop();
if (command) {
command.undo();
}
}
}
const receiver = new Receiver();
const addCommand = new AddCommand(receiver, 10);
const invoker = new Invoker();
invoker.storeAndExecute(addCommand);
console.log(receiver.value); // 10
invoker.undoLastCommand();
console.log(receiver.value); // 0
위 예제는 타입스크립트로 간단한 덧셈 기능을 갖는 커맨드 패턴을 구현한 것입니다.
결론
커맨드 패턴은 요청을 객체로 캡슐화하여 유연하게 처리할 수 있는 패턴으로, 타입스크립트와 함께 사용하면 정적 타입 지정을 통해 더욱 견고한 코드를 작성할 수 있습니다. 사용자가 요청한 작업을 캡슐화하여 처리하는 것은 향후 유지보수와 확장에 유리하며, 특히 사용자 인터페이스와 트랜잭션 처리 등의 영역에서 유용하게 활용될 수 있습니다.
참고 자료: Refactoring Guru - Command Pattern