Template Literal Types로 타입 안전하게 코딩하기

TypeScript 4.1의 Template Literal Type은 문자열 리터럴 타입을 조합해 이벤트 핸들러 이름이나 정렬 방향 조합처럼 반복되는 타입 정의를 자동으로 만들 수 있습니다. 글은 Union 타입, Capitalize와 매핑 타입을 활용해 이벤트 이름 한 곳만 수정해도 관련 핸들러 타입이 함께 바뀌도록 구성하는 방법을 보여줍니다. Conditional Type과 infer, 재귀 타입을 결합하면 문자열의 접두사·공백을 처리하거나 점으로 연결된 경로를 튜플로 나눌 수 있습니다. 이를 객체 경로의 값 타입을 찾는 ValueOf와 조합하면 lodash.set()의 입력값까지 타입 안전하게 검사할 수 있으며, JSON 파싱이나 DOM 선택자 타입 추론 같은 응용 가능성도 소개합니다.

• Template Literal Type은 문자열 리터럴 타입을 조합해 새로운 타입을 만들며, Union 타입과 결합하면 가능한 조합을 자동으로 생성합니다.
• Capitalize 같은 내장 타입과 매핑 타입을 함께 쓰면 이벤트 이름에서 핸들러 이름을 파생해 중복 정의를 줄일 수 있습니다.
• Conditional Type의 infer로 타입 일부를 추출하고, 재귀 타입으로 문자열을 자르거나 튜플을 변환할 수 있습니다.
• 경로 문자열을 Split으로 나누고 ValueOf로 객체를 따라가면 깊은 프로퍼티를 다루는 함수의 값 타입을 추론할 수 있습니다.