개요

TypeScript는 매 릴리스마다 타입 시스템의 표현력을 확장하고 있습니다. 5.0부터 5.7까지의 주요 신기능들은 개발자가 더 정확하고 안전한 코드를 작성할 수 있도록 지원합니다. Decorators 표준화, const 타입 파라미터, 향상된 타입 추론 등 TypeScript 5.x의 핵심 기능과 고급 타입 패턴을 정리합니다.

핵심 개념

1. TC39 Decorators (5.0): ECMAScript 표준 데코레이터가 정식으로 도입되었습니다. experimentalDecorators 플래그 없이 사용 가능하며, 클래스와 클래스 멤버에 메타프로그래밍 기능을 제공합니다.

2. const 타입 파라미터 (5.0): 제네릭 함수에서 리터럴 타입을 더 쉽게 추론할 수 있습니다. as const 단언 없이도 정확한 타입 추론이 가능합니다.

3. satisfies 연산자 (4.9): 타입 안전성을 유지하면서도 타입 추론을 보존할 수 있는 강력한 도구입니다.

4. 향상된 타입 내로잉 (5.3-5.7): switch(true) 패턴, Symbol.hasInstance 지원, 제어 흐름 분석 개선 등으로 타입 좁히기가 더욱 정교해졌습니다.

실전 예제

TC39 표준 Decorator를 활용한 로깅 패턴입니다.

// TC39 표준 Decorator - experimentalDecorators 불필요
function logged(
  target: any,
  context: ClassMethodDecoratorContext
) {
  const methodName = String(context.name);
  return function (this: any, ...args: any[]) {
    console.log(`[LOG] ${methodName} called with:`, args);
    const result = target.call(this, ...args);
    console.log(`[LOG] ${methodName} returned:`, result);
    return result;
  };
}

class Calculator {
  @logged
  add(a: number, b: number): number {
    return a + b;
  }
}

const calc = new Calculator();
calc.add(2, 3); // [LOG] add called with: [2, 3] → [LOG] add returned: 5

const 타입 파라미터와 satisfies를 조합한 패턴입니다.

// const 타입 파라미터 - 리터럴 타입 추론
function createRoute<const T extends readonly string[]>(
  paths: T
): { paths: T; navigate: (path: T[number]) => void } {
  return {
    paths,
    navigate: (path) => console.log(`Navigating to ${path}`),
  };
}

const router = createRoute(['/home', '/about', '/blog']);
router.navigate('/home');   // OK
router.navigate('/unknown'); // Error: 타입에 없는 경로

// satisfies로 타입 안전성 + 추론 보존
type Route = {
  path: string;
  method: 'GET' | 'POST' | 'PUT' | 'DELETE';
};

const apiRoutes = {
  getUsers: { path: '/users', method: 'GET' },
  createUser: { path: '/users', method: 'POST' },
  updateUser: { path: '/users/:id', method: 'PUT' },
} satisfies Record<string, Route>;

// apiRoutes.getUsers.method의 타입: "GET" (리터럴 보존)

활용 팁

  • Template Literal Types를 활용하면 문자열 패턴에 대한 타입 검증이 가능합니다. API 경로, CSS 색상 값 등에 유용합니다.
  • Conditional Types + infer 조합으로 함수 반환 타입이나 Promise 내부 타입을 추출할 수 있습니다.
  • Mapped Types의 as 절을 사용하면 키를 변환하면서 새로운 타입을 생성할 수 있습니다.
  • NoInfer<T> 유틸리티 타입(5.4)을 사용하면 특정 위치에서 타입 추론을 방지하여 의도치 않은 타입 확장을 막을 수 있습니다.
  • tsconfig의 verbatimModuleSyntax 옵션을 활성화하면 import/export 구문이 더 예측 가능해집니다.
  • isolatedDeclarations(5.5)를 활성화하면 병렬 빌드가 가능해져 대규모 프로젝트의 빌드 성능이 향상됩니다.

마무리

TypeScript 5.x는 더 정확한 타입 표현, 더 나은 개발자 경험, 더 빠른 빌드 성능을 동시에 추구하고 있습니다. 특히 TC39 표준과의 정렬, 타입 추론 개선은 장기적으로 JavaScript 생태계 전체에 긍정적인 영향을 미칩니다. 최신 기능들을 적극적으로 활용하여 더 안전하고 표현력 있는 코드를 작성해 보세요.