[Typescript] Type VS Interface
2023-12-06
Type과 Interface가 비슷해서 한가지만 사용하는 분들이 많다고 들었다. 은근히 견해가 자주 바뀌는 주제인 것 같아서 요즘은 어떤 견해가 있는지 본 후 요약한 글 (2023.12.6)
들어가면서
나는 보통 interface를 쓰고 type은 필요한 경우에만 사용한다.(ex.유니온, 함수)
타입스크립트를 배운 이후 쭉 이렇게 쓴 이유는 기능, 성능이 비슷해도 만들어진 배경이 달라서이다.
interface는 ‘객체의 설계도’로 그룹, 모임, 조합에 중점을 두고 나왔다.
이에 비해 type은 ’어떤 데이터가 담길지 구체적으로 묘사’하기 위해 만들어졌다. 그래서 복잡한 묘사를 위해 interface보다 기능이 더 많다고 생각한다.
그래서 interface에는
{} 부호가, type에는 = 부호가 사용되는 것도 위의 개념과 어울어진다고 생각한다.📝 공부한 내용 정리
I Cannot Believe TypeScript Recommends You Do This! 라는 해외 영상을 본 후 정리한 내용입니다.
- 둘의 성능은 비슷하지만 하나만 쓰는 것은 좋지 않다.
- 타입스크립트 공식문서에서는 interface 우선 사용, type은 기능이 필요할 경우 사용하는 것을 추천합니다.
💭 공식문서에서 이렇게 추천한 거는 이번에 찾아보면서 발견했다!
이제 개인적인 견해에서 멈추지 않고 자신있게 사용할 수 있겠다!
- interface의 차별화된 기능은 Declaration Merging
Declaration Merging이란 아래 예시처럼 같은 이름으로 선언을 하면 병합이 되는 기능이다.
예시
💭💭💭 개인적으로는 이 기능을 알아도 잘 사용하지 않았다. 이유는 같은 이름인데 내용은 달라져서 코딩하면서 헷갈릴 것 같았다. 개인적으로는 extends로 병합해 새로 만든 것에 더 명확한 이름을 붙여주는 방식을 더 선호한다. declaration merging이 적합하다고 생각하는 케이스가 있으면 생각이 바뀔 수 있을 것 같다!
- 성능이 차이나는 지점이 있다
객체를 합칠 때 type(&)보다 interface(extends)를 사용하는 것이 성능상 이점이 있다.
그리고 type(&)는 합쳐졌다기보다는 교차타입으로 둘 다 가능하다는 것에 더 가깝고
interface(extends)는 말그래도 확장한 것이여서 합쳐 만든 하나이다.
💭💭💭 interface가 객체(OOP)를 고안하고 만들어진거여서 이런 구조에 관한게 더 잘 만들어져있나하는 생각이 든다!
✍️ 한줄 요약
interface를 사용하다 interface에는 없는 복잡한 묘사가 필요한 경우에 type을 사용한다.
유현지
안녕하세요