[TypeScript] type vs interface

 

 

 

타입을 정의하는 방법에는 두 가지 방법이 있습니다.

type과 interface 인데요, 두 가지 방식의 차이점을 알아봅시다.

 

 

 

 

 

1. type vs interface

 

📚 타입을 확장하는 방법

 

type은 & 연산자, interface는 extends 키워드를 이용합니다.

interface IStudent2 extends IStudent {
	age: number;
}

type TStudent2 = TStudent & {
	age: number;
};

 

 

 

 

 

📝 선언적 확장

 

interface에서 할 수 있는 대부분의 기능들은 type에서 가능하지만, 한 가지 중요한 차이점은 type은 새로운 속성을 추가하기 위해서 다시 같은 이름으로 선언할 수 없지만, interface는 항상 선언적 확장이 가능하다는 것입니다.

 

 

 

interface

interface Student {
  name: string;
}

// 선언적 확장 가능
interface Student {
  age: number;
}

const student: Student = {
  name: 'jenny',
  age: 12,
};

 

interface는 동일한 이름으로 재선언이 가능하기 때문에 선언적 확장되어 Student Interface에 age 속성이 추가됩니다.

 

 

 

 

 

 

type

type Student = {
  name: string;
};

// error: Duplicate identifier 'Student'
type Student = {
  age: number;
};

const student: Student = {
  name: 'jenny',
  age: 12, // error: 'age' does not exist in type 'Student'
};

 

type은 동일한 이름으로 재선언이 불가능하기 때문에 Duplicate identifier 에러가 발생하고, Student type에 age 속성이 추가되지 않습니다.

 

 

 

 

2. type vs interface, 어떤 걸 사용하는 게 좋을까?

 

💡 상황에 따라 적절히 사용하자.

 

 

type 원시 타입에 대한 타입을 정의하는 경우

interface 객체 타입에 대한 타입을 정의하는 경우

 

 

 

 

 

 

 

 

 

 

 

 

참고 자료

 

출처: https://jungpaeng.tistory.com/99

[TypeScript] type과 interface 비교