[TypeScript]타입 별칭(Type Alias)

타입 별칭(Type Alias)

타입 별칭은 type 키워드를 사용하여 타입에 이름을 설정하는 방법입니다. 타입 별칭을 정의하는 방법은 type 뒤에 별칭을 입력하고 = 연산자 뒤에 타입을 정의합니다.

type 별칭 = 타입;

 

이름(Name)은 항상 문자열이고 나이(Age)는 항상 숫자라면 다음 예제처럼 type을 Name과 Age로 만들 수 있습니다.

type Name = string;
type Age = number;

let name:Name = 'Tom';
let age:Age = 20;

타입 별칭은 유용한 방법처럼 보이지만, 위 예제처럼 string, number과 같은 원시 타입에 별칭을 정의하는 것은 권유하지 않습니다.

---

객체에 타입 별칭 사용

타입 별칭은 객체에 타입을 정의하는 경우 유용하게 사용할 수 있습니다. 다음은 name, age, isDeath라는 속성을 가지는 객체입니다.

const tomPerson: {name: string; age: number; isDeath: boolean} = {
  name: "Tom",
  age: 20,
  isDeath: false
};

const joelPerson: {name: string; age: number; isDeath: boolean} = {
  name: "Joel",
  age: 40,
  isDeath: true
};

객체를 생성할 때마다 {name: string; age: number; isDeath: boolean}를 반복해서 사용한다면 코드가 굉장히 길어진다는 문제가 발생합니다.

다음 예제처럼 {name: string; age: number; isDeath: boolean}를 타입 별칭으로 정의하고 객체를 생성할 수 있습니다!

type Person = {
  name: string; 
  age: number; 
  isDeath: boolean;
};

const tomPerson: Person = {
  name: "Tom",
  age: 20,
  isDeath: false
};

const joelPerson: Person = {
  name: "Joel",
  age: 40,
  isDeath: true
};

 

만약, 사망 여부(isDeath)를 몰라서 값을 정의할 수 없는 경우 물음표(?)를 사용하여 isDeath를 선택적 프로퍼티로 정의합니다.

type Person = {
  name: string; 
  age: number; 
  isDeath?: boolean;
};

const tomPerson: Person = {
  name: "Tom",
  age: 20
};

const joelPerson: Person = {
  name: "Joel",
  age: 40
};

반응형

---

함수에 타입 별칭 사용

객체뿐만 아니라 함수도 타입 별칭을 사용할 수 있습니다. 다음은 name: string, age: number라는 2개의 인수를 가지며, string값을 반환하는 함수입니다.

const stringFunc = (name: string, age: number): string => {
  return `name: ${name} / age: ${age}`;
}

타입 별칭을 생성합니다.

type StringFunc = (name: string, age: number) => string;

함수명 뒤에 타입 별칭 StringFunc을 타입으로 정의합니다.

const stringFunc:StringFunc = (name, age)  => {
  return `name: ${name} / age: ${age}`;
}

---

정리

이번 포스팅에서는 타입 별칭에 대해 소개하였습니다.

• 타입 별칭은 타입에 별칭을 정의하는 방법입니다.
• 원시 타입에 대해 타입 별칭을 사용하는 것은 유용한 방법이 아닙니다.
• 객체와 함수의 타입을 정의할 수 있습니다.