프론트엔드/TypeScript

[TypeScript] 기본 문법 알아보기 2

병걸 2023. 5. 15. 16:57

기본 문법 알아보기 에 이어서 계속 문법에 대해서 알아보자.

 

const numbers: readonly number[] = [1, 2, 3, 4];
numbers.push(1); // readonly 때문에 오류가 뜬다.

위 코드와 같이 readonly 를 사용하게되면 number[ ]의 값을 읽을수만 있으면 수정을 하게 될경우 오류가 뜨게 됩니다.

 

let a: unknown;

let b = a + 1 // Error가 납니다.

if (typeof a === "number") {
  let b = a + 1;
}

위 코드에서 a에 unknown을 주었습니다. 첫줄이 의미하는 건 a가 어떤 작업을 하려면 a 변수의 타입을 먼저 확인해야 하는 뜻입니다. 예를 들어 2번째 코드인 let b = a+1에서 Error가 나는 이유는 a의 변수는 unknown 이기 때문입니다. 하지만 3번쨰 코드는 a의 변수 타입을 먼저 number로 확인을 한 후에 let b를 호출하기 때문에 에러가 나지 않습니다.

 

function hello(): never {
  throw new Error("xxx");
}

function bye(name: string | number) {
  if (typeof name === "string") {
  } else if (typeof name === "number") {
  } else {
    name; // name의 타입은 never이 됩니다.
  }
}

위 코드에서 hello 함수에 never를 활용하여 Error를 출력하였다. never는 함수가 절대 return 하지 않을 때 발생합니다. 즉 return 하지 않고 오류를 발생시키는 함수입니다. 이걸 활용한 예시가 있습니다.

두번째 bye 함수에서 name의 타입 string이나 number이라면 제대로 동작이 될 것이고 아니라면 name이 never의 타입을 가지게 되어 Error가 나오게 됩니다.