[TypeScript] 타입 별칭 (Type Alias)

타입 별칭 (Type Alias)

  - 특정 타입/인터페이스 등을 참조할 수 있는 타입 변수
  - 재선언 불가능

type userName = string;
type userName = number; // 에러 발생

  - 활용
     · 해당 타입이 어떤 역할을 하는지 이름을 짓고 싶을 때
     · 여러 번 반복되는 타입을 변수화해서 쉽게 표기하고 싶을 때
 

# 선언하기

// 기본 타입 별칭
type UserName = string;

// 객체 타입 별칭
type User = {
    name: string;
    age: number;
}

// 유니언 타입 별칭
type Message = string | number;
type Status = "success" | "error" | "loading";

// 제네릭 활용
type ApiResponse<T> = {
    code: number;
    data: T;
}

# 사용하기

let myName: UserName = "yang";

function logMessage(message: Message) {
    console.log(message);
}

 

---

타입 별칭과 인터페이스 비교

# 기본 문법

// 타입 별칭
type UserType = {
  id: number;
  name: string;
};

// 인터페이스
interface UserInterface {
  id: number;
  name: string;
}

# 확장 가능성

인터페이스	타입 별칭
상속과 확장 가능	기존 타입에 속성을 추가할 수 없음 => 확장하려면 인터섹션 연산자를 사용해야 함
동일한 이름으로 인터페이스를 여러 번 선언하면 합쳐짐 : 선언 병합 (Declaration Merging)	동일한 이름으로 선언할 수 없음 (에러 발생)

// 인터페이스
interface User {
  id: number;
  name: string;
}

// 기존 인터페이스에 속성을 추가함
interface User {
  email: string;  
}

const user: User = {
  id: 1,
  name: "Alice",
  email: "alice@example.com",
};

--------------------------------

// 타입 별칭
type Person = {
  id: number;
  name: string;
};

// 인터섹션으로만 확장 가능
type Employee = Person & { role: string };

# 유니언 타입

인터페이스	타입 별칭
유니언 타입을 정의할 수 없음	유니언 타입 등 복합 타입을 정의할 수 있음

type Status = "success" | "error" | "loading";

# 함수 및 배열 타입 표현

  - 타입 별칭을 사용하면 인터페이스보다 더 간결하게 사용할 수 있음

// 타입 별칭
type StringArray = string[];
type Callback = (text: string) => void;

// 인터페이스
interface CallbackInterface {
  (text: string): void;
}

# 클래스

인터페이스	타입 별칭
클래스 구현에 사용할 수 있음	클래스를 구현하는 데 사용되지 않음

interface Animal {
  name: string;
  makeSound(): void;
}

class Dog implements Animal {
  name = "Dog";
  makeSound() {
    console.log("Woof!");
  }
}