Reference DOCS

타입단언(type assertion)

다시 한 번 강조하지만, 타입 단언이 막아주는 건 타입 에러 뿐이다. 절대 런타임 오류가 나지 않을 것이라는 확신이 있거나 런타임 에러가 나도 상관 없는 상황이 아니라면 이런 식으로 호환되지 않는 타입을 any를 거쳐 단언하는 일은 피하는게 좋다.

Documentation - Everyday Types

<aside> 👩‍🌾 타입 단언은 컴파일 시간에 제거되므로, 타입 단언에 관련된 검사는 런타임 중에 이루어지지 않습니다. 타입 단언이 틀렸더라도 예외가 발생하거나 null이 생성되지 않을 것입니다.

</aside>

as, <> 단언

• as 단언

  const myCanvas = document.getElementById("main_canvas") as HTMLCanvasElement;
  
  const x = "hello" as number; // ❌ 당연히 너무 터무니 없는건 안 됨 .. 
  

👉 타입스크립트는 HTMLElement겠거니 정도만 알 수 있는 반면에 개발자는 HTMLCanvasElement임을 알고 있을 수 있음

• <> 단언

  const myCanvas2 = <HTMLCanvasElement>document.getElementById("main_canvas");
  
  const stringBraceAssertion = <string>"merong";
  

👉 꺾쇠괄호 단언은 tsx 파일이 아닌 경우에 가능 ****

• any / unknown로 선 변환 뒤 원하는 타입으로 변환

Const 단언

<aside> 👩‍🌾

as const 를 쓰면 readonly로 만들어버림 ! 배열과 객체 리터럴에서 동작하는 const-assertion만 사용할 수 있습니다:

</aside>

Documentation - TypeScript for Functional Programmers

// non-assertion
const normalArray = [1, 2, 4];
normalArray.push(3);// ⭕️ 상수 임에도 추가가 됨..

const normalObj = {state:"요즘잘자쿨냥이"}
normalObj.state="통모짜핫도그" // ⭕️ 이게 상수라고 할 수 있나?

**//type assertion - as const**
const assertionArray = [1,2,3,4] **as const**
assertionArray.push **// ❌ readonly [1,2,3,4] 형식에 push 속성이 없습니다.**

const assertionObj = { state: "요즘잘자쿨냥이" } **as const;**
assertionObj.state="통모짜핫도그"**// ❌ 읽기 전용 속성이므로 'state'에 할당할 수 없습니다.**