[TypeScript] 타입, 타입과 인터페이스의 차이

이 글은 인프런의 TypeScript 입문 - 기초부터 실전까지 강의를 듣고 정리한 글입니다.

type MyString: string;
const str: MyString = 'hello';

string 타입에 MyString이라는 별칭을 부여했다.

타입은 인터페이스 뿐만 아니라 다른 곳에다가도 쓸 수 있다. 그리고, 타입을 부여할 수 있는 모든 곳에 별칭을 부여할 수 있다.

타입 별칭은, 새로운 타입 값을 하나 생성하는 것이 아니라, 정의한 타입에 대해 나중에 쉽게 참고할 수 있게 이름을 부여하는 것이다.

 

이제 두 가지가 어떤 차이점이 있는지, VSCode의 프리뷰로 비교해보자.

인터페이스로 설정했을 때

타입으로 설정했을 때

이렇게 보면 큰 차이는 보이지 않지만, 엄연히 두 방법은 차이점이 있다.

인터페이스는 객체에 들어갈 속성에 대한 타입을 정의한 것들을 인터페이스로 정의하였고, 그 이름을 Human이라고 하였다. 인터페이스를 이용해서 타입을 정의한 후 사진 상의 프리뷰를 보면 인터페이스를 가리킨다. (위 사진)

타입 키워드로 정의를 하게 되면, "name, age"의 타입들에 대해 별칭을 부여한 것이기 때문에 프리뷰 상에서 별칭을 모두 보여주게 된다. 이러한 점에서 차이가 있다.

 

이러한 작은 차이들도 있지만, 큰 차이점도 있다. 타입은 확장이 불가능하다. (인터페이스는 extends 키워드로 확장이 가능하다.)

그래서, 가능한 한 type보다는 interface로 사용할 것을 typescript 공식 문서에서도 권장하고 있다.