[NEXT.JS] Enums(열거형)과 Constants(상수)

개요

처음 개발을 할 때 변하지 않고 반복사용되는 모든 값에 대해 Constants를 사용했습니다.

예를 들어 HTTP METHOD나 URL, 약관 설명 등에 대한 긴 Contents 등에 대해서입니다.

 

Constants

// HTTP METHOD
Const HttpMethod = {
    PUT: 'PUT',
    GET: 'GET',
    DEL: 'DELETE',
    POST: 'POST'
}

 

그러다 다른 프로젝트들을 접하면서 HTTP METHOD나 URI 등을 Enums로 사용하는 것을 보면서 이에 대한 확실한 개념정리가 필요하다고 느끼게 되었습니다.

 

Enums

enum HttpMethod {
  GET = 'GET',
  POST = 'POST',
  PUT = 'PUT',
  DEL = 'DEL',
}

 

 

Enums

Enum은 관련된 상수 값들의 집합을 정의할 때 사용하는 구조입니다. 주로 의미 있는 이름을 부여한 숫자나 문자열 집합을 나타낼 때 사용합니다. 자바스크립트/타입스크립트에서 enum은 타입 안정성도 제공하므로, 컴파일 시점에서 잘못된 값을 사용할 위험을 줄일 수 있습니다.

 

사용시기

● 유한한 값의 집합 : 서로 관련이 있는 값을 그룹으로 정의할 때

● 값에 의미를 부여 : 숫자나 문자열 값에 의미 있는 이름을 부여할 때

● 타입 안정성 필요 : 값이 특정한 옵션 집합에 포함된다는 것을 컴파일러 수준에서 보장하고 싶을 때

● 연관된 상태 : 상태나 단계, 카테고리 등 여러 선택지를 가지는 경우

 

사용

enum UserRole {
  Admin = 'admin',
  Editor = 'editor',
  Viewer = 'viewer'
}

// 사용
const userRole: UserRole = UserRole.Admin;

if (userRole === UserRole.Admin) {
  console.log('User is an admin');
}

 

장점과 단점

타입 안전성 : 잘못된 값 사용을 방지

가독성 : 숫자나 문자열 대신 의미 있는 이름을 사용하여 코드의 가독성을 향상

자동 완성 : IDE에서 자동 완성 기능이 작동하여 실수를 방지

컴파일 후 코드 크기 증가 : 일부 상황에서 TypeScript에서 컴파일된 enum이 JavaScript로 변환될 때 추가적인 코드가 생성됩니다.

값 확장 제한 : 런타임에서 값이 변하지 않기 때문에, 동적으로 값을 확장하거나 추가하기 어렵습니다.

 

 

Constants

Constants는 변하지 않는 고정된 값을 정의할 때 사용됩니다. 일반적으로 코드에서 여러 번 사용될 값들을 상수로 정의하여 유지보수성을 높이고, 실수를 방지합니다.

 

사용시기

재사용 가능한 값 : 특정 값이 여러 곳에서 반복적으로 사용될 때

변하지 않는 값 : 런타임에 값이 변하지 않고 고정된 값을 정의할 때

일반적인 설정 값 : API URL, 시간 제한 값, 구성 설정 등 고정된 설정 값을 정의할 때

 

 

사용

const API_URL = 'https://api.example.com';
const TIMEOUT = 5000;
const MAX_RETRIES = 3;

// 사용
fetch(API_URL, { timeout: TIMEOUT })
  .then(response => response.json())
  .catch(error => console.log('Request failed:', error));

 

장점과 단점

단순성 : 상수는 단일 값이므로 복잡하지 않습니다.

유지보수성 : 상수를 사용하면 값이 여러 곳에서 변경되어야 할 때 한 번의 수정으로 해결할 수 있습니다.

메모리 절약 : 상수는 메모리 공간을 한 번만 차지합니다.

타입 안정성 부족 : 상수는 그 자체로 타입 안정성을 보장하지 않으며, 다른 값으로 변경될 가능성이 있습니다.

구조 부족 : enum처럼 값 간의 관계를 정의할 수 없습니다.

 

 

사용분류

사용 상황	Enum	Constant
연관된 값의 집합	관련된 값들을 집합으로 관리하고 싶을 때 (예: 상태, 역할)	단일 값 또는 의미가 고정된 값(예: URL, 시간 제한)
타입 안전성	타입스크립트에서 특정 값 집합만 허용하고 싶을 때	값이 변경되지 않음을 보장하고 싶을 때
가독성	숫자나 문자열보다 의미 있는 이름을 사용하고 싶을 때	가독성을 높이기 위한 의미 있는 고정 값 사용
다양한 선택지	명시적인 선택지를 제공할 때 (예: 여러 상태, 단계)	특정 값(예: 하나의 상수 값, URL 등)을 사용해야 할 때
코드 확장성	상태나 역할을 추가하거나 수정할 가능성이 있는 경우	재사용 가능한 고정 값이 필요할 때

 

 

문의사항이나 피드백은 댓글로 남겨주세요.