[TypeScript] Interface 와 Type 의 차이

 

TypeScript를 다루다 보면 interface와 type 이라는 두 가지 방법으로 타입을 정의할 수 있는 것을 자주 접하게 된다.  겉으로 보기에는 비슷해 보이지만, 둘 사이에는 몇 가지 중요한 차이점과 각자만의 유용한 특징들이 있다.

 

---

1. 기본적인 정의

• Interface: 객체의 구조를 정의하는 데 사용되는 문법이다. interface는 주로 클래스나 객체의 형태를 설명한다.

interface User {
  name: string;
  age: number;
  greet(): void;
}

 

• Type: 변수 안에 타입에 대한 정보를 대입해서 저장해놓는 개념이다. 기본적인 객체 형태뿐 아니라 유니언 타입, 교차 타입 등 다양한 타입 조합을 정의하는 데 적합하다.

type User = {
  name: string;
  age: number;
  greet(): void;
};

 

2. 사용 가능 범위와 확장성

• 확장 (Extend):
  • interface는 상호 간에 정의한 약속 혹은 규칙을 의미한다. 타입스크립트에서 인터페이스는 보통 다음과 같은 범주에 대해 약속을 정의할 수 있다.

interface Person {
  name: string;
}

interface Employee extends Person {
  role: string;
}

 

• type 역시 확장이 가능하지만, 주로 교차 타입 (Intersection Type)을 통해 결합한다. 다음과 같은 방식으로 다른 타입을 결합할 수 있다. (선언적 확장이 불가능하다.)

type Person = {
  name: string;
};

type Employee = Person & {
  role: string;
};

 

3. Union 및 기타 유연성

• Union : type을 사용하면 유니언을 쉽게 정의할 수 있다. 예를 들어, 여러 개의 타입을 결합하여 하나의 타입으로 정의할 수 있습니다.

type Status = "success" | "error" | "loading";

 

interface는 이러한 유니언 타입을 직접 지원하지 않으므로, 복잡한 타입 조합이 필요하다면 type을 사용하는 것이 좋다.

---