type과 interface는 TypeScript에서 타입을 정의하는 두 가지 주요 방법이다. 이 둘은 비슷한 기능을 제공하지만, 사용 방법과 몇 가지 중요한 차이점이 있다.
Interface와 Type
Interface
타입스크립트는 한 객체가 다른 객체를 상속할 수 있게 해주는 interface 라는 일급 클래스 원시 타입(first-class primitive)을 제공한다.
주로 객체 구조를 정의하는데 사용한다.
interface WithId {
id: string
}
interface User extends WithId {
name: string
}
const user: User = {
id: '0623',
name: 'chanmin',
wrongProperty: 123, // Error!
}Type
type 키워드는 객체 타입뿐만 아닌 모든 유형의 타입을 정의할 수 있다.
또한 유니온(|) 또는 인터섹션(&) 타입, 튜플 등과 같이 복잡한 타입을 정의하는데 사용할 수 있다.
Interface와 Type의 주요 차이점
- 확장성 : interface는 다른 interface로 확장(extends)하거나 구현(implements)할 수 있다.
반면에 type은 인터섹션(&)을 통해 결합될 수 있다.
interface Animal {
name: string;
}
interface Bear extends Animal {
honey: boolean;
}
const bear = getBear();
// type 예시
type Animal = {
name: string;
};
type Bear = Animal & {
honey: boolean
};
const bear = getBear();- 머징 : 여러 인터페이스가 같은 이름으로 선언되면, 하나의 인터페이스로 병합(merge)된다. 이것은 네임스페이스와 유사하다.
반면에 type은 같은 이름으로 선언되면 에러가 발생한다.
interface Window {
title: string
}
interface Window {
ts: TypeScriptAPI
}
// 위 두 인터페이스는 아래처럼 병합된다.
interface Window {
title: string
ts: TypeScriptAPI
}마무리
객체 지향적인 방식으로 코드를 작성하려면 주로 interface 를 사용하고 , 함수형 패턴이나 더 복잡한 데이터 구조를 다루려면 type 을 사용하는 것이 좋다.
type의 장점
- 암묵적인 인덱스 시그니처
- 재선언 불가 (const 키워드의 역할)
interface의 장점
- 상속이 필요한 경우 캐싱을 활용할 수 있다.
- interface 라는 이름의 특성 상, 보다 휴리스틱한 사용이 가능하다.
