본문 바로가기

Language/TypeScript

[TypeScript] Interface가 런타임에는 없다고? (feat. 꼬리에 꼬리를 무는 궁금증..)

인프런 조현영 님의 NestJS 강의를 듣던 도중.. 해당 강의에 대한 질문들을 둘러보다가 아래 질문과 답변을 보게 되었다.

 

인프런 수강생 Q.
"타입스크립트에서 DTO 생성 시 클래스, 인터페이스 둘 중에 어떤 것으로 만들어야 하나요?"


조현영 님 A.

"가장 큰 차이는 interface는 런타임에 없고, class는 런타임에 있는 것입니다. 런타임에 있어서 런타임에도

  타입체크를 수행하길 원하면 class로 선언하면 되고, 런타임에는 없길  원하면 interface를 쓰시면 됩니다."

 

가장 큰 차이는 interface는 런타임에 없고, class는 런타임에 있는 것입니다.
런타임에 있어서 런타임에도 타입체크를 수행하길 원하면 class로 선언하면 되고,
런타임에는 없길  원하면 interface를 쓰시면 됩니다.

 

 

위 답변에 대해서 나는 궁금증이 생겼다. 

이때 단순히 왜 Interface는 런타임에 없는 거지?라는 의문점이 생겨서 검색을 하게 되었고 자바스크립트에는 

인터페이스가 없다는 것을 알게 되었다. (왜 이것을 몰랐을까..😅) 그러면 타입스크립트 컴파일 시 자바스크립트 파일로

변환되니까 인터페이스 코드가 아예 삭제가 되기 때문에 런타임에도 존재하지 않는 건가?라는 의문점이 또 생겨버렸다.

(검색하고 알면 알수록 늘어나는 궁금증..)

 

결국 나는 듣고 있던 강의의 질문 찬스를 사용하기로 했다! 조현영 님한테 강의 별개의 질문을 드리게 되었다. 🔥🔥🔥

 

디고(글쓴이..) Q.

클래스와 인터페이스의 차이가 런타임이 존재하는지의 여부라고 답변해 주신 글을 봤었습니다. 여기서 궁금한 점이

타입스크립트 인터페이스가 런타임에 없는 이유가 뭔가요?? 컴파일 시 자바스크립트 파일에서 인터페이스가 삭제되면서 런타임 시 제외가 되는 것인가요?? 자바스크립트에는 인터페이스 문법이 없다고 알고 있는데.. 문법이 없기 때문에

컴파일할 수 없어서 삭제되고 런타임에서는 제외가 되는 것인지.. 궁금해져서 조금 더 구체적으로 알고 싶습니다!

 

조현영 님 A.

네 맞습니다. 노드는 자바스크립트를 실행하지 타입스크립트를 실행하지 않습니다. 타입스크립트 코드는 전부 자바스크립트로 변환되며 변환 과정에는 타입스크립트 고유 문법인 인터페이스는 삭제됩니다. 그래서 자바스크립트에서는

인터페이스를 가질 수 없습니다. 그래서 클래스를 대신 사용하는 것이고요.

 

 

드디어.. 명쾌한 답변을 받고 궁금증이 사라졌다. 다시 돌이켜서 생각해 보니 인터페이스가 자바스크립트 문법이

아니란 걸 알았다면 조금 더 답에 금방 다가갈 수 있었던 것 같긴 하다. 자바스크립트에 대한 개념이 부족하단걸 알았고

다시 예전에 읽었던 자바스크립트 책을 꺼내 들고 있다.. 다시 읽어봐야지..😅

 

요즘 문득 TypeScript 강의와 NestJS 강의를 들으면서 궁금한 점이 많이 생겨난다. 예전에 공부했지만 개념을 까먹거나

처음 들어보는 것들도 있긴 했다. 오늘 이해가 안 돼서 개념 정리가 안 된다면, 다음날 다시 검색해서 개념을 정리한다.

조금 중요하다고 생각하는 것은 깃 TIL로 기록하고 있다. 기억 안 나면 정리된 내용을 다시 읽어보면 되니까!

 

 

 

끊임없이 생각하고 개선하는 개발자, 앞으로도 끊임없이 생각하고 개선하는 개발자를 위해 힘내자 🙂