TypeScript-섹션3. 타입스크립트 이해하기- 서로소 유니온 타입(9)

손주완·2025년 7월 9일

TypeScript Section3

목록 보기
8/8

선요약

각 타입에 공통된 리터럴 속성(보통 kind, type, status 등) 을 지정해,
해당 속성을 기준으로 타입을 구분(discriminate) 할 수 있게 만든 타입

1. 서로소 유니온 타입

교집합이 없는 타입들을 모아 만든 유니온 타입

type Admin = {
  name: string;
  kickCount: number;
};

type Member = {
  name: string;
  point: number;
};

type Guest = {
  name: string;
  visitCount: number;
};

type User = Admin | Member | Guest;

function login(user: User) {
  if ("kickCount" in user) {
		// Admin
    console.log(`${user.name}님 현재까지 ${user.kickCount}명 추방했습니다`);
  } else if ("point" in user) {
		// Member
    console.log(`${user.name}님 현재까지 ${user.point}모았습니다`);
  } else {
		// Guest
    console.log(`${user.name}님 현재까지 ${user.visitCount}번 오셨습니다`);
  }
}

위의 코드를 보면,
User 타입의 매개변수 user를 받아, 타입 좁히기를 통해 console.log를 실행

직관적이지 못하므로 tag 프로퍼티를 추가

type Admin = {
  tag: "ADMIN";
  name: string;
  kickCount: number;
};

type Member = {
  tag: "MEMBER";
  name: string;
  point: number;
};

type Guest = {
  tag: "GUEST";
  name: string;
  visitCount: number;
};

type User = Admin | Member | Guest;

function login(user: User) {
  if (user.tag === "ADMIN") {
    console.log(`${user.name}님 현재까지 ${user.kickCount}명 추방했습니다`);
  } else if (user.tag === "MEMBER") {
    console.log(`${user.name}님 현재까지 ${user.point}모았습니다`);
  } else {
    console.log(`${user.name}님 현재까지 ${user.visitCount}번 오셨습니다`);
  }
}

0개의 댓글