[TIL] TypeScript-Enum 및 Literal Type

🌼 Enum?

연관된 아이템들을 함께 묶어서 표현할 수 있는 수단이다. Complie된 파일을 보면 Enum은 Interface와 다르게 코드가 직접적으로 구현되어 있는데 이는 Enum이 runtime에 존재하는 실제 객체라는 것을 의미한다.

enum GenderType {
  Male,
  Female
};

interface Student {
  gender: GenderType,
  subject: string
};

function getStudentDetails(studentID: number): Student {
  return {
    gender: GenderType.Male,
    subject: "Node JS"
  }
};

🌻 Numeric Enum(숫자 열거형)

enum GenderType {
  Male,
  Female
};

                          ↓     
(Compile시 enum의 item에 각각의 숫자자 부여됨을 알 수 있다.)    

var GenderType;
(function (GenderType) {
  GenderType[GenderType["Male"] = 0] = "Male";
  GenderType[GenderType["Female"] = 1] = "Female";
})(GenderType || (GenderType = {}));

🌻 String Enum

• Numeric Enum의 각 Item에 String 값을 부여하면 String Enum이 된다.

enum GenderType {
  Male: "male",
  Female: "female"
};

                          ↓       

var GenderType;
(function (GenderType) {
  GenderType["Male"] = "male";
  GenderType["Female"] = "female";
})(GenderType || (GenderType = {}));

🌼 Literal Type

emum과 동일하게 literal item의 type을 구분하면서 좀 더 알기쉽고 간결하게 정의할 수 있는 장점이 있다. 각각의 literal을 " | " 으로 구분하여 연결하면 된다.

interface Student {
  gender: "male" | "female",
  subject: string
};

function getStudentDetails(studentID: number): Student {
  return {
    gender: "male",
    subject: "Node JS"
  }
};

출처: YOUTUBE-땅콩코딩