[TS] Enum, Inference, Assertion

Enum

• 상수를 말함

  // JavaScript
  const MAX_NUM = 6;
  const DAYS_ENUM = Object.freeze({ MONDAY: 0, TUESDAY: 1, WEDNESDAY: 3 }); // 객체의 경우 freeze 메서드로 변경 불가능하게 만듦
  const dayOfToday = DAYS_ENUM.MONDAY;

  // TypeScript
  enum Days {
    Monday, // 값을 할당하지 않으면 자동으로 0부터 설정 됨
    Tuesday,
    Wednesday,
    Thursday,
    Friday,
    Saturday,
    Sunday,
  }
  console.log(Days.Saturday);
  let day: Days = Days.Sunday;
  day = Days.Friday;
  day = 10; // enum에 지정되어 있지 않은 상수로도 할당할 수 있기 때문에 문제가 발생할 수 있음
  console.log(day);

  // enum보다 union을 쓰는게 바람직
  // 모바일 클라이언트(안드로이드, ios)와 통신해야하는 경우라면 enum을 사용: 코틀린, 스위프트는 union type이 없기 때문에!
  type DaysOfWeek = "Monday" | "TuesDay" | "Wednesday";
  let dayOfWeek: DaysOfWeek = "Monday";
  dayOfWeek = "TuesDay";
  dayOfWeek = 1; // 오류 발생

Type Inference: 타입 추론

• 타입을 명시하지 않아도 TS에서 타입을 추론하여 지정하지만, 가독성 등을 위해 정확하게 명시해주는 것이 좋다

let text = "hello"; // type을 생략하면 값에 따라 자동으로 type이 적용
  text = "hi";
  text = 1;

  function add(x: number, y: number) {
    // number 인자 2개를 더하기 때문에 add()의 return type에 number를 추론하여 적용시킴
    return x + y;
  }

  const result = add(1, 2); // add()가 number이기 때문에 result type도 number로 추론되어 적용됨

Type Assertion

• 타입 단언, 컴파일러가 타입 추론을 잘 못하거나 너무 보수적으로 할 경우 타입을 지정할 수 있음
• 100% 장담할 수 있는 경우에만 사용할 것!

function jsStrFunc(): any {
    return "hello";
  }
  const result = jsStrFunc(); // jsStrFunc가 any이기 때문에 string이 아닌 다른 타입이 들어올 수도 있음
  console.log((result as string).length); // 하지만 Type Assertions으로 string 값만 들어온다고 장담하게 되면 String API 사용 가능
  console.log((<string>result).length); // Type Assertions

  const wrong: any = 5;
  console.log((wrong as Array<number>).push(1));

  function findNumbers(): number[] | undefined {
    return undefined;
  }
  const numbers = findNumbers()!; // ! : 배열 값만 들어온다고 장담한다는 뜻
  // 또는 numbers!.push(2);
  numbers.push(2);

  const button = document.querySelector("button"); // Element | null
  button.nodeValue; // null 값이 들어올 수도 있다는 경고가 뜸(타입 단언을 사용하면 해결 가능)