TypeScript에서 type과 interface는 둘 다 타입을 정의하는 데 사용되지만, 몇 가지 중요한 차이점이 있다.
각각의 특징과 사용 시기를 비교해보려 한다.
Type vs Interface
1. 정의 방식:
- type: 타입 별칭(Type Alias)을 생성한다.
- interface: 인터페이스를 선언한다.
type User = {
name: string;
age: number;
};
interface User {
name: string;
age: number;
}
2. 확장성:
- type: 교차 타입(
&)을 사용하여 확장한다. - interface: extends 키워드를 사용하여 확장한다.
type Animal = {
name: string;
}
type Bear = Animal & { honey: boolean };
interface Animal {
name: string;
}
interface Bear extends Animal {
honey: boolean;
}
3. 유니온 타입:
- type: 유니온 타입을 쉽게 정의할 수 있다.
- interface: 유니온 타입을 직접 정의할 수 없다.
type Status = "pending" | "approved" | "rejected";
// interface로는 직접적인 유니온 타입 정의 불가
4. 선언 병합:
- type: 동일한 이름으로 재선언 할 수 없다.
- interface: 동일한 이름으로 여러 번 선언하면 자동으로 병합된다.
interface Window {
title: string;
}
interface Window {
ts: TypeScriptAPI;
}
// 두 인터페이스가 자동으로 병합됨
// type은 재선언 불가
// type Window = { title: string; }
// type Window = { ts: TypeScriptAPI; } // 에러!
5. 계산된 프로퍼티:
- type: 계산된 프로퍼티를 사용할 수 있다.
- interface: 계산된 프로퍼티를 직접 사용할 수 없다.
type Keys = "firstname" | "surname";
type DudeType = {
[key in Keys]: string;
}
// interface로는 직접적인 계산된 프로퍼티 사용 불가
사용 시기:
1. interface 사용:
- 객체의 구조를 정의할 때
- 클래스가 구현해야 할 규약을 정의할 때
- 확장성이 필요하고, 선언 병합을 활용하고 싶을 때
- 라이브러리나 외부 코드와의 통합에서 일관성을 유지하고 싶을 때
2. type 사용:
- 유니온 타입, 교차 타입 등 복잡한 타입을 정의할 때
- 튜플이나 배열 타입을 정의할 때
- 함수 타입을 정의할 때
- 매핑된 타입이나 조건부 타입 등 고급 타입 기능이 필요할 때
일반적으로, 객체 구조를 정의할 때는 interface를 사용하고, 그 외의 경우에는 type을 사용하는 것이 좋다.
하지만 이는 절대적인 규칙은 아니며, 프로젝트의 요구사항과 팀의 컨벤션에 따라 유연하게 선택할 수 있어야 한다.
