[TypeScript] 조건부 타입

📚 조건부 타입이란 무엇인가요?

TypeScript의 조건부 타입(Conditional Types)은 타입 시스템 내에서 조건문을 사용할 수 있게 해주는 기능이에요. 이를 통해 입력된 타입에 따라 다른 타입을 반환할 수 있으며, 이는 TypeScript의 타입 시스템을 더욱 유연하고 동적으로 만들어 줘요.

 

조건부 타입은 TypeScript에서 T extends U ? X : Y와 같은 형태로 표현돼요. 여기서 T가 U 타입에 할당 가능한지 여부에 따라 X 타입을 반환하거나, 그렇지 않으면 Y 타입을 반환해요. 이는 프로그래밍에서의 일반적인 조건문(if-else)과 유사한 개념이에요.

 

조건부 타입은 '도로의 분기점'에 비유할 수 있어요. 여러분이 운전을 하다가 도로가 두 갈래로 나뉘는 지점에 도달했다고 상상해 보세요. 이때, 여러분은 목적지에 따라 왼쪽 또는 오른쪽 길을 선택해야 해요. 조건부 타입에서는 이러한 '분기점'이 타입이 특정 조건(T extends U)을 만족하는지 여부에 따라 결정돼요. 조건을 만족하면 '왼쪽 길'(타입 X)을 선택하고, 그렇지 않으면 '오른쪽 길'(타입 Y)을 선택하는 것과 같아요.

 

---

🖥️ 조건부 타입의 구조와 사용 예시

1. 조건부 타입의 구조

• 타입스크립트의 조건부 타입은 다음과 같은 기본 형태를 가지고 있어요:
  • 이 구조는 프로그래밍에서 일반적으로 사용되는 조건문(if-else)과 유사해요. 조건부 타입은 타입 시스템 내에서 "만약 TypeA가 TypeB에 할당 가능하다면 TypeC를 사용하고, 그렇지 않다면 TypeD를 사용한다"는 로직을 구현해요.

TypeA extends TypeB ? TypeC : TypeD;

'TypeA extends TypeB'는 조건 표현식입니다.
이 표현식은 'TypeA'가 'TypeB'의 서브 타입이거나, 다시 말해 'TypeA'가 'TypeB'에 할당 가능한지를 평가합니다.
'?' 바로 뒤에 오는 'TypeC'는 조건이 참일 때 사용되는 타입입니다.
':' 바로 뒤에 오는 'TypeD'는 조건이 거짓일 때 사용되는 타입입니다.

2. 조건부 타입의 사용 예시

조건부 타입은 타입의 조건에 따라 다른 타입을 반환할 수 있게 해 주어, 타입스크립트의 타입 시스템을 더욱 유연하게 만들어요.

type IsNumber<T> = T extends number ? "Yes" : "No";

'IsNumber'는 제네릭 타입 T가 number 타입에 할당 가능한지 여부에 따라 "Yes" 또는 "No"를 반환하는 조건부 타입입니다.
'T extends number'는 T가 number 타입에 할당 가능한지 검사합니다. 이는 T가 number 타입이거나 number 타입으로 변환될 수 있는지를 의미합니다.
'? "Yes" : "No"'는 조건이 참이면 "Yes"를, 거짓이면 "No"를 반환합니다.

• type Result1 = IsNumber<42>;에서 42는 number 타입이므로, IsNumber<42>는 "Yes"를 결과로 해요.

type Result1 = IsNumber<42>; // "Yes"

'IsNumber<42>', 여기서 'T'는 리터럴 타입 42입니다.
42는 'number' 타입에 할당 가능하므로, 조건부 타입은 '"Yes"'를 반환합니다.

• type Result2 = IsNumber<"Hello">;에서 "Hello"는 string 타입이기 때문에 number 타입에 할당 가능하지 않아요. 따라서, IsNumber<"Hello">는 "No"를 결과로 해요.

type Result2 = IsNumber<"Hello">; // "No"

'IsNumber<"Hello">', 이 경우 'T'는 문자열 리터럴 타입 "Hello"입니다.
"Hello"는 'number' 타입에 할당할 수 없으므로, 조건부 타입은 '"No"'를 반환합니다.

 

---

🤔 조건부 타입의 고급 사용법

조건부 타입은 더 복잡한 타입 연산과 함께 사용될 수 있어요. 예를 들어, 두 타입 중 하나를 선택하는 유틸리티 타입을 만들거나, 타입에 따라 다른 타입을 반환하는 매핑 타입을 생성하는 데 사용할 수 있어요.

1. 타입 필터링

• 타입 필터링은 주어진 유니온 타입에서 특정 조건을 만족하는 타입만 추출하는 패턴이에요.

type FilterNumber<T> = T extends number ? T : never;

type Result = FilterNumber<string | number | boolean>; // number

'FilterNumber'는 유니온 타입 'T'에서 'number' 타입만을 추출합니다.
'extends' 키워드를 사용하여 각 유니온 타입의 멤버가 'number'에 할당 가능한지 확인하고, 할당 가능한 경우 그 타입을 그대로 사용하며, 그렇지 않은 경우 'never' 타입을 반환합니다.
따라서, 'Result' 타입은 'number'가 됩니다.

2. 타입 추론과 infer 키워드

• infer 키워드는 조건부 타입 내에서 타입을 동적으로 추론하는 데 사용돼요. 이는 주로 제네릭 타입의 특정 부분을 "추출"할 때 유용해요.

type ElementType<T> = T extends (infer U)[] ? U : never;

type T1 = ElementType<number[]>; // number
type T2 = ElementType<string[]>; // string

'ElementType'는 배열 'T'의 요소 타입을 추론합니다.
'T'가 어떤 타입의 배열이라면, 해당 타입을 'U'로 추론하고, 그 타입을 반환합니다.
만약 'T'가 배열이 아니라면, 'never'를 반환합니다. 따라서, 'T1'은 'number', 'T2'는 'string'이 됩니다.

3. 조건부 타입을 이용한 타입 매핑

• 조건부 타입은 객체 내의 각 속성 타입을 변환하는 데에도 사용할 수 있어요. 이는 매핑된 타입과 함께 사용되어, 객체의 각 속성에 대해 특정 연산을 수행할 수 있게 해요.

type ReadonlyProperties<T> = {
  [P in keyof T]: T[P] extends Function ? T[P] : Readonly<T[P]>;
};

interface Person {
  name: string;
  age: number;
  greet(): void;
}

type ReadonlyPerson = ReadonlyProperties<Person>;

'ReadonlyProperties'는 객체 'T'의 각 속성을 검사하여, 속성 타입이 'Function'인 경우 그대로 두고, 그렇지 않은 경우에는 'Readonly' 타입으로 변환합니다.
이를 통해 'Person' 인터페이스의 'name'과 'age' 속성은 읽기 전용이 되지만, 'greet' 메서드는 변경되지 않습니다.

 

---

🚨 주의할 점

조건부 타입을 사용할 때는 몇 가지 주의해야 할 점이 있어요. 이러한 주의 사항을 이해하고 적절히 대처함으로써, 코드의 가독성을 높이고, 예상치 못한 버그를 방지할 수 있어요.

1. 복잡성 관리
   • 주의 사항: 조건부 타입은 매우 강력하지만, 사용이 과도하거나 복잡해지면 코드의 가독성과 유지 관리가 어려워질 수 있어요.
   • 대처 방안: 가능한 한 간결하게 유지하고, 복잡한 조건부 타입은 작은 단위로 분리하여 관리하는 것이 좋아요.
2. 순환 참조
   • 주의 사항: 조건부 타입을 사용하여 서로 참조하는 타입을 정의할 때 순환 참조가 발생할 수 있어요. 타입스크립트는 순환 참조를 처리할 수 있지만, 이로 인해 컴파일러의 성능이 저하되거나 예상치 못한 동작이 발생할 수 있어요.
   • 대처 방안: 순환 참조가 필요한 경우에는 주의 깊게 설계하고, 타입의 정의를 가능한 한 단순하게 유지해야 해요.
3. 타입 추론과 infer 사용
   • 주의 사항: infer 키워드를 사용할 때는 타입이 올바르게 추론되는지 주의 깊게 확인해야 해요. 잘못된 추론은 타입 에러를 발생시키거나 예상치 못한 결과를 초래할 수 있어요.
   • 대처 방안: infer 사용 시, 타입 추론이 의도한 대로 작동하는지 테스트하고, 필요한 경우 타입 추론을 명시적으로 제한하여 안정성을 높여야 해요.
4. 유니온 타입과의 상호작용
   • 주의 사항: 조건부 타입을 유니온 타입과 함께 사용할 때, 각 유니온 멤버에 대해 조건부 타입이 별도로 적용돼요. 이는 때때로 예상치 못한 결과를 초래할 수 있어요.
   • 대처 방안: 유니온 타입과 함께 조건부 타입을 사용할 때는 결과를 주의 깊게 검토하고, 필요한 경우 유니온 타입을 먼저 정제(refinement)하거나 분해(destructuring)하여 처리해야 해요.
5. 성능 고려
   • 주의 사항: 매우 복잡한 조건부 타입은 타입스크립트 컴파일러의 성능에 영향을 줄 수 있어요.
   • 대처 방안: 성능 문제가 의심되는 경우, 조건부 타입의 복잡성을 줄이거나 다른 방법으로 문제를 해결하는 것을 고려해야 해요.

 

---

📖 결론

조건부 타입은 타입스크립트에서 복잡한 타입 로직을 구현할 수 있게 해주는 강력한 도구예요. 이 기능을 사용함으로써, 개발자는 조건에 따라 타입을 분기할 수 있으며, 이는 라이브러리 작성, API 응답 타입 처리, 유틸리티 타입 생성 등 다양한 상황에서 유용하게 활용될 수 있어요.

 

조건부 타입을 효과적으로 사용하기 위해서는 타입스크립트의 타입 시스템에 대한 깊은 이해가 필요해요. 또한, 조건부 타입을 남용하면 코드의 복잡성이 증가할 수 있으므로, 필요한 경우에 적절히 사용하는 것이 중요해요.

 

결론적으로, 조건부 타입은 타입스크립트를 사용하는 개발자들에게 매우 유용한 기능이에요. 이를 통해 더욱 강력하고 유연한 타입 시스템을 구축할 수 있으며, 타입 관련 문제를 해결하는 데 큰 도움이 돼요. 조건부 타입의 올바른 사용은 타입스크립트 프로젝트의 타입 안정성과 코드의 유지보수성을 크게 향상할 수 있어요.

 

개발자로서 타입스크립트의 이러한 고급 기능을 숙지하고 활용하는 것은, 타입 안정성이 중요한 애플리케이션을 개발할 때 큰 이점을 제공해요. 조건부 타입을 포함한 타입스크립트의 다양한 기능을 적극적으로 탐구하고 활용함으로써, 더욱 견고하고 유지보수가 용이한 코드베이스를 구축해 나갈 수 있을 것이에요.

 

---

🔗 추가 정보

• 타입스크립트의 조건부 타입에 대한 더 깊은 이해를 원하신다면, TypeScript 공식 문서에서 자세한 정보를 찾아볼 수 있어요.