Typescript [4] - 열거형,리터럴타입

만약 gender 타입이 string으로 되어있을 때, female과 male로만 지정하고 싶을 때?
=> enum을 활용해보자!

enum(열거형)

: 연관된 아이템들을 함께 묶어서 표현할 수 있는 수단
1. enum 선언
2. enum의 이름을 지어준다.
3. 선택할 수 있는 값을 넣어준다.
4. enum으로 type을 바꿔준다.

enum GenderType {
  Male,
  Female,
}

function App() {
  let studentID: number = 12345;
  let studentName: string = "jenny";
  let age: number = 20;
  let gender: string = "female";
  let subject: string = "javascript";
  let courseCompleted: boolean = false;

  interface Student {
    studentID: number;
    studentName: string;
    age?: number;
    gender: GenderType;
    subject: string;
    courseCompleted: boolean;
    // addComment(comment: string): string;
    addComment?: (comment: string) => string;
  }

  function getStudentDetails(studentID: number): Student {
    return {
      studentID: 22,
      studentName: "kim",
      //   age: 22,
      gender: GenderType.Male,
      subject: "js",
      courseCompleted: true,
    };
  }

이 때 enum의 안에 있는 값들이 male은 0, female은 1이 할당되게 된다.(자바스크립트 방식으로 컴파일시) 이 방식을 number enum이라고 하고,

enum GenderType {
  Male='Male';
  Female='Female'
}

이렇게 할당하게 되면 male = male, female=female이 할당되며 이 방식을 string enum이라고 한다.

리터럴타입

function App() {
  let studentID: number = 12345;
  let studentName: string = "jenny";
  let age: number = 20;
  let gender: string = "female";
  let subject: string = "javascript";
  let courseCompleted: boolean = false;

  interface Student {
    studentID: number;
    studentName: string;
    age?: number;
    gender: "male" | "female";
    subject: string;
    courseCompleted: boolean;
    // addComment(comment: string): string;
    addComment?: (comment: string) => string;
  }

  function getStudentDetails(studentID: number): Student {
    return {
      studentID: 22,
      studentName: "kim",
      //   age: 22,
      gender: "male",
      subject: "js",
      courseCompleted: true,
    };
  }

gender에 male | female로 조건을 넣어주어 더 간단하게 구현할 수 있다. 그렇다면 enum이 선언되지 않아도 된다는 점!