프론트엔드 개발 · 중급
TypeScript의 데코레이터(Decorators)는 무엇이며, 클래스, 메서드, 속성 데코레이터의 기본적인 사용 목적과 실제 애플리케이션에서 어떤 방식으로 활용될 수 있는지 예시를 들어 설명해 주세요.
힌트 · 데코레이터는 클래스, 메서드, 속성 등에 메타데이터를 추가하거나 동작을 변경하는 함수로, AOP 패턴을 구현하거나 프레임워크에서 설정 정보를 주입하는 데 활용됩니다. (현재는 실험적 기능)
메타데이터함수 데코레이터클래스 데코레이터메서드 데코레이터속성 데코레이터
모범답안
TypeScript의 데코레이터는 클래스, 메서드, 속성 등에 추가적인 메타데이터를 제공하거나 동작을 수정하는 함수입니다. 일종의 "장식"이라고 생각하면 이해하기 쉽습니다.
클래스 데코레이터는 클래스 자체를 수정하거나 확장하는 데 사용됩니다. 예를 들어, 싱글톤 패턴을 구현하거나, 클래스에 로깅 기능을 추가할 수 있습니다.
메서드 데코레이터는 메서드의 동작을 가로채거나 수정합니다. AOP(Aspect-Oriented Programming)에서 로깅, 권한 검사 등에 활용될 수 있습니다.
속성 데코레이터는 속성의 접근 방식을 제어하거나, 유효성 검사를 수행하는 데 사용됩니다. 예를 들어, 데이터 바인딩 프레임워크에서 속성의 변경을 감지하는 데 활용될 수 있습니다.
데코레이터는 현재 TypeScript에서 실험적인 기능이지만, 코드의 재사용성을 높이고 유지보수를 용이하게 하는 강력한 도구입니다.
읽었다면, 이제 직접 답해볼 차례예요
패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.
함께 보는 TypeScript 면접 질문
- TypeScript의 내장 유틸리티 타입 중 `Partial<T>`, `Pick<T, K>`, `Omit<T, K>` 각각의 역할과 실제 프로젝트에서 어떤 상황에 유용하게 활용될 수 있는지 설명해 주세요.
- JavaScript 라이브러리를 TypeScript 프로젝트에서 사용해야 할 때 `.d.ts` 선언 파일이 어떤 역할을 하는지 설명하고, 직접 선언 파일을 작성해야 하는 경우와 기존 선언 파일을 활용하는 방법을 비교하여 설명해 주세요.
- TypeScript에서 타입 별칭(Type Aliases)과 인터페이스(Interfaces)는 모두 객체 타입을 정의하는 데 사용됩니다. 두 가지의 주요 차이점은 무엇이며, 각각 어떤 상황에서 더 적합한지 설명해 주세요.
- 복잡한 비동기 데이터 처리 로직에서, 특정 조건에 따라 반환 타입이 동적으로 결정되는 함수를 TypeScript로 어떻게 안전하게 모델링하고 구현할 수 있을까요? 특히, 제네릭과 조건부 타입을 활용하여 Union Type을 분해하고 재구성하는 고급 기법을 설명해주세요.
- 서드파티 라이브러리(예: `express` 또는 `lodash`)의 타입 정의가 불완전하거나, 애플리케이션 특정 요구사항에 맞춰 기존 타입을 확장해야 할 때, TypeScript에서 안전하고 모듈화된 방식으로 이를 처리하는 방법을 설명해주세요. 특히, 전역 선언 확장과 모듈 확장 간의 차이점 및 사용 시나리오를 비교하여 설명해주세요.
- 대규모 모노레포 환경에서 TypeScript 프로젝트를 관리할 때, 빌드 성능을 최적화하고 타입 의존성을 효율적으로 관리하기 위한 `tsconfig.json` 설정 전략에 대해 설명해주세요. 특히 `project references`의 도입 배경, 동작 방식, 그리고 이를 활용하여 얻을 수 있는 이점을 구체적인 예시와 함께 설명해주세요.