Colin's Blog
[typescript] 비동기 작업의 결과를 통지하는 Observer 패턴 구현 방법

비동기 작업을 수행할 때, 작업이 완료되면 그 결과를 통지하여 다음 단계로 처리해야 하는 경우가 있습니다. 이때 Observer 패턴을 사용하여 간단하게 작업 결과를 통지할 수 있습니다.

Observer 패턴이란 무엇인가?

Observer 패턴은 객체 간의 일대다 의존 관계를 정의합니다. 한 객체(주제)의 상태가 변하면, 그 객체에 의존하는 다른 객체(옵서버)에게 자동으로 알립니다. 이 패턴은 객체 간의 결합을 약하게 하여 유연한 설계를 가능하게 합니다.

TypeScript로 Observer 패턴 구현하기

Observer 패턴을 TypeScript로 구현하는 방법은 다음과 같습니다.

주제(Subject) 클래스 구현

class Subject {
  private observers: Array<Observer> = [];

  public attach(observer: Observer): void {
    this.observers.push(observer);
  }

  public detach(observer: Observer): void {
    const index = this.observers.indexOf(observer);
    if (index !== -1) {
      this.observers.splice(index, 1);
    }
  }

  public notify(): void {
    for (const observer of this.observers) {
      observer.update();
    }
  }
}

옵서버(Observer) 인터페이스 및 클래스 구현

interface Observer {
  update(): void;
}

class ConcreteObserver implements Observer {
  update(): void {
    // 작업 결과에 대한 처리 로직
    console.log('작업이 완료되었습니다.');
  }
}

사용 예시

const subject = new Subject();
const observer = new ConcreteObserver();

subject.attach(observer);
// 비동기 작업 수행
// 작업 완료 시 subject.notify() 호출

결론

Observer 패턴을 통해 객체 간의 의존 관계를 느슨하게 유지하고, 비동기 작업의 결과를 효과적으로 통지할 수 있습니다.

참고 자료

© 2018 Colin. All rights reserved.