inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

@시코 - TypeScript 제대로 배우기(초중급)

union & literal type (1)

interface 와 type

108

프빌쳐

작성한 질문수 1

2

안녕하세요. 잘듣고 있습니다:)

강의에서 웬만하면 interface 대신 type 을 쓰라고 말씀하시더라고요!
저는 줄곧 type 만 쓰다가 최근에 props 같은 객체 타입은 interface를 사용하는 방향으로 바꿨는데, 이런 경우도 interface 보다 타입을 쓰는게 좋나요?(왜 그런지가 궁금합니다..!!)

그리고 interface 랑 type의 차이를 더 자세히 알고싶어요!

javascript react typescript

답변 2

3

시니어코딩

interface가 할 수 있는건 대부분 type alias가 할 수 있습니다. 다만 interface 같은 경우 이미 정의된 interface에 속성을 추가할 수 있다는 장점이 있습니다. 그래서 JavaScript/DOM/NextAuth 등 기본적으로 제공되는 API와 Library들은 대부분 interface로 타입을 정의하고, 이 API / Library를 사용하는 개발자들이 타입을 확장할 수 있도록 한 것입니다.

결론을 말씀드리면, 지금 TS 버전은 type alias도 class가 inplements 할 수 있어 거의 구분없이 사용하므로 일단은 type alias를 사용하시고, 나중에 다른 곳에서 확장이 필요한 경우 interface를 사용하시면 됩니다.

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 프빌쳐님.

TypeScript에서 interfacetype은 모두 객체의 형태를 정의하는 데 사용되지만 몇 가지 차이점이 있습니다. 기본적으로 두 개념 모두 유사한 역할을 하지만, 사용하는데 있어서 상황에 따라 더 적합한 것이 있습니다.

  1. interface: 이는 주로 객체의 형태를 정의하는 데 사용되며 새로운 속성을 추가하여 확장이 가능합니다. interface는 주로 클래스와 함께 사용되기도 하며, 동일한 이름의 인터페이스를 결합해 확장할 수 있습니다. 이는 특히 라이브러리나 API 타입을 확장할 때 강력할 수 있습니다.

  2. type: 더 일반적인 형태의 타입 선언을 제공하며, 대개 함수 타입이나 튜플 등을 포함할 수 있습니다. type은 기본적으로 좀 더 유연하게 사용될 수 있지만 interface와 달리 이름 중복을 통한 선언 병합이 불가능합니다.

왜 Type을 권장하는가:
- 유연성: type은 유니언 및 인터섹션 타입을 포함하는 등 좀 더 다양한 형태를 정의할 수 있습니다.
- 명확성: 복잡한 타입을 다루는 데 있어 가독성을 좋게 할 수 있습니다.

하지만 interface가 여전히 적합한 경우도 있습니다:
- 이메일 라이브러리에서의 확장성: 여러 개의 모듈에서 동일한 인터페이스에 특성을 추가하고자 할 때 interface는 유리합니다.
- 클래스 타입 검사 및 구현: 클래스와 함께 사용할 때 interface는 클래스에 대한 구현 여부를 검증하는 데 유리합니다.

더 많은 차이점과 사용 방법에 대해서는 아래 링크에서 자세한 내용을 확인하실 수 있습니다:

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

스킬, 플러그인, 마켓플레이스 관련 문의

0

17

2

클로드 코드 요금제 대신 사용량 기반 과금제를 사용하고 있습니다.

0

17

2

25강부터 소리만 나오고 화면이 안나옵니다.

0

20

1

imagesLoaded에 관한 질문

0

12

2

useEffect와 lifecycle문의

0

16

1

cd 다음에 어떻게 자연스럽게 문자가 써지죠?

0

19

1

클로드코드에 적용할 하네스? 툴? 추천 부탁드립니다.

0

22

1

14강 GIT 설치후 ~ config 명령어 입력이 안돼요

0

18

1

161강 자료 파일 안에 내용이 없네요.

0

24

2

/ide 명령어 실행 오류

0

20

2

Next.js 사전렌더링 이해하기 부분

0

18

1

subagents에 관한 질문이 있습니다.

0

24

2

클로드 코드 설치가 되지 않습니다...

0

28

2

output sytles 모든 프로젝트 적용시 디렉토리가 헷갈립니다 ㅠㅠ

0

28

2

터미널 줄바꿈 세팅

0

27

1

setting.json과 setting.local.json

0

31

2

카드 뉴스 만들기..

0

27

2

기존 mcp를 플러그인으로 대체

0

26

2

바이브코딩을 하는 개발자(작업복잡도 판단의 어려움)

0

28

2

커서에서 클로드 코드 실행했는데 쉬프트 +엔터가 안먹히는데요.

0

21

2

claw code 에 대해서는 어떻게 생각하시나요?!

0

29

2

비개발자용 리서치나 논문검색 프로젝트 요청

0

27

2

프론트엔드 학습 수준 문의

0

27

2

교재와 git 링크 문의

0

125

1