타입스크립트에서 데코레이터는 클래스, 메서드, 프로퍼티 또는 매개변수에 메타데이터를 추가하거나 기능을 추가하기 위한 강력한 도구입니다. 데코레이터를 사용하여 프로그램의 동작을 수정하거나 새로운 동작을 추가할 수 있습니다.

데코레이터의 기본 구조

데코레이터는 @ 기호를 이용하여 표시되며, 클래스, 메서드, 프로퍼티 또는 매개변수 앞에 위치합니다. 데코레이터는 함수로 정의되며 대상 및 추가적인 메타데이터를 조작하거나 대상에 대한 액세스 권한을 갖습니다.

데코레이터를 사용하여 기능 추가하기

아래 예제는 클래스 데코레이터로 클래스를 로깅하는 기능을 추가하는 방법을 보여줍니다.

function Logger(constructor: Function) {
  console.log('Logging...');
  console.log(constructor);
}

@Logger
class MyClass {
  // 클래스 내용
}

위 예제에서 Logger 데코레이터는 MyClass 클래스를 로깅하는 기능을 추가합니다. 데코레이터 함수는 대상 클래스의 생성자 함수에 대한 액세스를 갖습니다.

데코레이터를 활용한 데이터 유효성 검사

아래 예제는 프로퍼티 데코레이터와 목표 유효성 검사를 이용하여 데이터 유효성을 검사하는 방법을 보여줍니다.

function Validate(target: any, propertyKey: string) {
  let value = target[propertyKey];

  const getter = () => {
    return value;
  };

  const setter = (val: any) => {
    // 데이터 유효성 검사
    if (val < 0) {
      throw new Error('Invalid value');
    } else {
      value = val;
    }
  };

  Object.defineProperty(target, propertyKey, {
    get: getter,
    set: setter,
    enumerable: true,
    configurable: true,
  });
}

class MyClass {
  @Validate
  value: number;

  constructor(value: number) {
    this.value = value;
  }
}

위 예제에서 Validate 데코레이터는 MyClass의 value 프로퍼티를 통해 데이터 유효성을 검사하는 기능을 추가합니다.

결론

타입스크립트의 데코레이터를 활용하면 코드에 메타데이터를 추가하거나 기능을 동적으로 확장할 수 있습니다. 이를 통해 유연하고 모듈화된 코드를 작성할 수 있으며, 코드의 가독성과 유지보수성을 향상시킬 수 있습니다.

더 많은 정보를 원하시는 경우, 타입스크립트 공식 문서를 참고하시기 바랍니다.