[TypeScript] 대수 타입

대수 타입

여러개의 타입을 합성해서 새롭게 만들어낸 타입

합집합 타입과 교집합 타입이 존재한다.

 

🍥 합집합 - Union 타입

바 | 를 이용하여 유니온 타입을 정의한다.

let a:string | number;
// string 타입과 number 타입을 모두 넣을 수 있음
a = 1;
a = "hello";

// boolean 타입의 값도 넣고 싶다면 추가하기
let b:string | number | boolean;

유니온 타입으로 정의된 변수에는 구성된 타입의 어떠한 값도 넣을 수 있다.

유니온 타입에 참여하는 타입들의 개수에는 제한이 없으므로 원하는 타입을 모두 추가할 수 있다.

 

🍡 Union 타입으로 배열 타입 정의하기

배열 타입 또한 유니온 타입으로 다양한 요소를 담을 수 있다.

let arr :(number | string | boolean)[] = [1, "hello", true];

 

🍡 Union 타입으로 배열 타입 정의하기

타입 별칭을 이용해 유니온 타입을 만들 수 있다.

type Dog = {
    name: string;
    color: string;
};

type Person = {
    name: string;
    language: string;
}

type Union1 = Dog | Person;

Union1 타입은 Dog 타입과 Person 타입의 유니온 타입이다.

Union 타입은 교집합이 존재하는 두 집합으로 표현할 수 있으며 두 집합이 가지는 프로퍼티를 모두 사용할 수 있다.

let union1: Union1 = {
    name:"",
    color: ""
};

let union2: Union1 = {
    name:"",
    language:""
};

let union3:Union1 = {
    name:"",
    color:"",
    language:""
};

let union4:Union1 = {
    name:"",  // 오류 ❌
};
// name 프로퍼티만 들어있는 union4는 Dog타입에도 Person 타입에도 속하지 않음

union4 의 경우에는 Dog 타입, Person 타입에 모두 속하지 않으므로 Union1 타입에 속하지 않는다고 본다.

 

 

---

🍥 교집합 - Intersection 타입

 & 연산자를 이용해 인터섹션 타입을 정의한다.

let variable: number & string;

그런데 변수에 마우스를 올리면 변수가 never 타입으로 정의되어 있다.

이는 number 타입과 string 타입은 서로 교집합을 공유하지 않는 서로소 집합이므로 변수의 타입은 never 타입(공집합)으로 추론되기 때문이다. 대다수의 기본 타입들 간에는 서로 공유하는 교집합이 없기 때문에 인터섹션 타입은 보통 객체 타입들에 자주 사용된다.

 

 

🍡 Intersection 타입과 객체 타입

type Dog = {
  name: string;
  color: string;
};

type Person = {
  name: string;
  language: string;
};

type Intersection = Dog & Person;

// Dog 타입과 Person 타입에 모두 속해야하므로 모든 프로퍼티를 가져야함
let intersection1: Intersection = {
  name: "",
  color: "",
  language: "",
};

인터섹션 타입은 두 타입의 교집합으로 Dog 타입과 Person 타입에 모두 속해야한다. 따라서 두 타입이 가진 모든 프로퍼티를 가져야 인터섹션 타입이라 할 수 있다.

 

 

---

🔗 타입스크립트 강의

한 입 크기로 잘라먹는 타입스크립트 - 인프런 | 강의