강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

rn_chic님의 프로필 이미지
rn_chic

작성한 질문수

한 입 크기로 잘라먹는 타입스크립트(TypeScript)

Enum 타입

enum 선언에 대한 질문

해결된 질문

작성

·

39

0

3-16을 듣다가 갑자기 궁금한 점이 생겨 질문드립니다.
정말로 거의 희박한 확률일꺼라 생각하지만 설명해주신것 같이 js파일에 enum이 포함되기 때문에 파일 크기가 증가하거나 오버헤드가 날 가능성이 있을꺼라 생각합니다.
혹시 리액트 + ts 환경에서 enum을 사용 할 경우 as const, const enum, enum 중에 더 추천해주시는 방법과 그 이유를 듣고싶습니다.

답변 2

0

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요 이정환입니다.

enum을 꼭 사용해야 하는 상황이라면 저는 되도록 const enum을 사용하는 편입니다. 이유는 강의에서도 말씀드린 것처럼 최적화와 밀접한 관련이 있기 때문이죠

다만, enum의 크기가 작고 내부적으로 많이 사용되지 않거나, 외부 라이브러리와 호환이 필요한 경우라면 굳이 const enum을 강박적으로 사용하지는 않습니다 ... 일부 트랜스파일러에서 const enum을 제대로 해석하지 못하는 문제가 있는걸로 알고 있어서 굳이 굳이 설정을 막 바꿔가면서 이를 사용하기보다는 그냥 enum을 사용하거나 혹은 as const를 사용하는 편 입니다.

0

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

타입스크립트에서 enum을 사용할 때 발생할 수 있는 오버헤드와 파일 크기 증가에 대해 우려하실 수 있습니다. enum, const enum, 그리고 as const 각각의 특성과 사용 시의 장단점을 간단히 설명드리겠습니다.

  1. enum: 일반적인 enum은 transpile 단계에서 자바스크립트 코드로 변환되기 때문에 실제로 코드 크기에 영향을 줄 수 있습니다. 이는 대규모 프로젝트에서 성능에 영향을 줄 수 있습니다.

  2. const enum: const enum은 컴파일 시점에 실제 값으로 내장됩니다. 따라서 가벼운 동작을 제공하지만, 이 경우 모든 사용이 인라인으로 처리되기 때문에 웹팩을 사용하는 경우 isolatedModules 옵션이 활성화되어 있어야 합니다. 이 옵션이 없으면 컴파일 에러가 발생할 수 있습니다.

  3. as const: 이는 as const를 사용하여 객체 리터럴의 속성 값이 상수로 평가되도록 하여 상수로 취급되는 방식을 의미합니다. 이것은 타입스크립트의 유니언 타입과 결합하여 타입 안전성을 높일 수 있습니다. 하지만 다른 두 방식에 비해 복잡할 수 있습니다.

리액트와 타입스크립트를 사용하는 환경에서는 주로 다음과 같이 추천드릴 수 있습니다:

  • 성능과 코드 크기가 매우 중요한 경우에는 const enum을 우선적으로 고려해보시는 것이 좋습니다.
  • 타입 안정성과 유지보수 측면을 더 중요시 여긴다면 as const 및 객체 리터럴을 사용하는 방식을 추천드립니다.
  • 기본적인 사용과 간단한 열거형이 필요하다면, 일반 enum을 사용해도 무방합니다.

이에 대한 더 구체적인 내용은 아래 게시물을 참고해보시길 추천드립니다:

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

rn_chic님의 프로필 이미지
rn_chic

작성한 질문수

질문하기