타입스크립트(typescript)/개념

[typescript] 타입 별칭

Doo Hee 2024. 7. 13. 22:28
Document

📝타입 별칭

타입 별칭이란?

특정 타입이나 인터페이스 등을 참조할 수 있는 타입 변수를 의미한다. 자바스크립트에서 변수를 선언할 때 변수 이름을 짓듯이 타입에 별칭을 부여하고 선언하는 것을 의미한다.

 

타입 별칭을 선언하는 방법은 type 키워드를 적고 별칭 = 데이터 타입; 형태로 적으면 된다.

type 별칭 이름 = 데이터 타입;

// 예시
type Age = number;

 

 

 

타입 별칭의 장점

타입 별칭의 장점은 코드의 중복을 피하게 해준다. 개발자라면 지켜야하는 원칙인 DRY(Don't Repeat Yourself) 원칙을 지킬 수 있게 해준다.

 

아래 코드를 보자. 첫번째 코드의 경우 코드가 중복되고 가독성이 떨어질뿐더러 함수를 호출하는 경우가 많아진다면 코드가 더 길어지는 단점이 발생한다.

// number | string 중복
function multiply(a: number | string) {
  console.log(a);
}

let b: number | string = "안녕하세요";
multiply(b);

let c: number | string = 98;
multiply(c);

 

 

하지만 타입 별칭으로 데이터 타입을 미리 선언하면 코드의 중복을 막을 수 있을 뿐더러 함수를 호출하는 경우가 많아져도 간단하게 코드를 작성할 수 있다.

type Multi = number | string;

function multiply(a: Multi) {
  console.log(a);
}

let b: Multi = "안녕하세요";
multiply(b);

let c: Multi = 98;
multiply(c);

 

 

 

타입 별칭 vs 인터페이스

위의 코드를 보면 타입 별칭은 인터페이스와 별 차이가 없어보인다. 인터페이스와는 구체적으로 어떻게 다른 것일까?

 

1) 코드 에디터에서 표기 방식

  • 타입별칭: 안에 선언된 데이터가 어떤 타입인지 구체적으로 명시한다.
  • 인터페이스: 'interface: 이름' 형태로만 출력이 된다.

 

2) 타입 확장 관점

  • 타입 별칭: 인터섹션 타입(&)으로 확장이 가능하다.
  • 인터페이스: 동일한 인터페이스를 재선언하여 합치거나(선언 병합) 상속을 통해 확장이 가능하다.

 

3) 사용 범위

  • 타입별칭: 데이터 타입 / 유니언 타입 / 인터섹션 타입 / 제네릭 타입 / 유틸리티 타입 / 맵드 타입
  • 인터페이스: 객체 타입 / 제네릭 타입