intersection 타입을 사용하여 union 타입을 명시하는 경우를 아래의 코드와 함께 살펴보도록 하겠습니다.
예시 1
interface TypeEx1 {
name: string;
age: number;
}
interface TypeEx2 {
name: string;
hobby: string;
}
const ex: TypeEx1 & TypeEx2 = {
name: "rati",
age: 5,
hobby: "eatting",
};
인터페이스 TypeEx1과 TypeEx2는 위와 같이 속성의 타입이 명시되어 있습니다. 인터페이스 TypeEx1과 TypeEx2를 인터섹션 타입을 사용하여 변수 ex의 타입을 명시하고 있습니다.
이 경우 인터페이스 TypeEx1에 명시된 속성 name, age의 내용과 일치하는 속성을 가지고 있어야 하며, 인터페이스 TypeEx2에 명시된 속성 name, hobby의 내용과 일치하는 속성을 가지고 있어야 합니다. 결과적으로 속성 name, age, hobby의 내용과 일치하는 속성을 가지고 있어야 합니다.
즉, 각 인터페이스에 명시된 속성 내용의 합집합 개념으로 접근할 수 있습니다.
예시 2
다음으로 union 타입을 intersection 타입을 사용하여 변수의 타입을 명시해주는 코드를 살펴보겠습니다.
type TypeEx1 = number | string;
type TypeEx2 = number | boolean;
const ex: TypeEx1 & TypeEx2 = "string"; // 타입 에러 발생
타입 별칭 TypeEx1과 TypeEx2는 위와 같이 union 타입이 명시되어 있으며, 변수 ex의 타입을 타입 별칭 TypeEx1과 TypeEx2를 인터섹션 타입 사용하여 명시하고 있습니다.
이 경우 예시 1과 다르게 인터섹션이 작동하게 됩니다. 예시 1처럼 합집합 개념으로 인터섹션이 작동하는 것이 아닌 교집합 개념으로 작동하게 됩니다.
즉, 변수 ex에 명시된 타입은 타입 별칭 TypeEx1과 TypeEx2의 union 타입에서 공통적으로 가지고 있는 number 타입이 됩니다.
'TypeScript' 카테고리의 다른 글
map 타입, condition 타입 (0) | 2023.01.14 |
---|---|
Promise에 제네릭(Generic) 문법 적용 (0) | 2023.01.06 |
인터페이스와 클래스 (0) | 2023.01.05 |
열거형 타입 (Enum) (0) | 2023.01.04 |
타입 스크립트 구성 옵션 (0) | 2023.01.03 |