[TypeScript] 타입 별칭(Type Alias)

 

---

- 타입 별칭

 

타입 별칭(Type Alias)란?

 

- type 키워드를 사용해서 타입을 지정하는 방식을 의미한다.

type TUser = {
  name: string;
  age: number;
};

function printUser(user: TUser): string {
    return `Name: ${user.name}, Age: ${user.age}`;
}

 

기존에는 인라인 방식으로 타입을 지정했다면, 이건 미리 지정해서 사용하는 것이라고 생각한다.

 

아래는 여러 방식으로 타입 별칭을 사용하는 방법이다.

 

 

---

 

- 기본적인 타입 별칭

type ID = string | number;

 

 

- 객체 타입 별칭

type User = {
    name: string;
    readonly age?: number;
};

const user: User = {
    name: "John",
    age: 20,
};

 

여기에서는 readonly라는 키워드를 사용했는데, 

 

readonly는 객체의 속성이나 배열의 요소가 수정되지 않도록 제한하는 키워드이다.

 

이 키워드를 사용하면, 해당 속성 또는 요소는 초기화 이후 변경할 수 없다는 특징이 있다.

 

 

- 함수 타입 별칭

type SumFunc = (n1: number, n2: number) => number;

const sum: SumFunc = function sum(n1, n2) {
    return n1 + n2;
};

 

 

- 제네릭 타입 별칭

제네릭 타입은 타입을 마치 함수의 매개변수처럼 전달받아 사용할 수 있고,

 

사용하는 시점에 구체적인 타입을 지정하게 된다.

 

또한 제네릭을 사용하면 타입 안정성을 유지하면서 다양한 데이터 타입을 처리할 수 있다.

// 관용적인 지정 방법
// Type
// Univeral
// K(Key), V(Value)
  
type Car<T, U> = {
    name: string;
    color: U;
    option: T;
};

const car: Car<null, string> = {
    name: "Benz",
    color: "black",
    option: null,
};

const car2: Car<string, string> = {
    name: "Benz",
    color: "black",
    option: "key",
};

const car3: Car<{ giftcard: boolean }, null> = {
    name: "Benz",
    color: null,
    option: {
      giftcard: true,
    },
};

 

 

- 튜플 타입 별칭

type Point = [number, number];

const point: Point = [10, 20];

 

 

- 인터렉션 타입 별칭

인터렉션 타입은 여러 타입을 결합하여 새로운 타입을 정의하는 방법으로,

 

각 타입의 속성을 모두 포함하는 객체를 만들 수 있도록 해준다.

type Nameable = {
    name?: string;
};

type Aageable = {
    age?: number;
};

type Person = Nameable & Aageable & {
    gender?: string;
};

const person: Person = {};

 

위의 코드는 옵셔널 파라미터를 사용했기 때문에 모든 속성이 선택적이므로,

 

아래의 person 또한 빈 객체({})도 유요한 값이 된다.

 

 

- 리터럴 타입 별칭

리터럴 타입이란, 특정 값만 허용하도록 타입을 제한하는 기능이다.

type Direction = "LEFT" | "RIGHT" | "UP" | "DOWN";
const direction: Direction = "RIGHT";

type Gender = "female" | "male" | "natural";
const gender: Gender = "male";

 

 

- 조건부 타입 별칭

조건부 타입이란, 특정 조건에 따라 타입을 동적으로 정의할 수 있는 기능이다.

 

아래 코드는 extends 뒤의 조건이 참인지 검사하고, 참이면 "Yes", 거짓이면 "No" 타입을 반환한다.

type IsString<T> = T extends string ? "Yes" : "No";

const test1: IsString<string> = "Yes";
const test2: IsString<number> = "No";

 

 

- 인덱스 시그니처 타입 별칭

인덱스 시그니처란, 객체의 키-값 쌍의 구조를 동적으로 정의할 수 있는 방법이다.

type UserMap = {
    name: string;
    age: number;
    [key: string]: string | number;
};

let userss: UserMap = {
    name: "john",
    age: 20,
    gender: "male",
    address: "seoul",
};

userss.name;

 

위의 코드에서 gender와 address는 키가 "string", 값이 "string"이므로 허용된다.

 

userss.name은 userss 객체의 name 속성이 타입 정의에 포함되어 있으므로 정상적으로 접근 가능하다.

---

참고 강의: https://www.sucoding.kr/