Study/TypeScript

[TS] 타입 단언 (Type Assertion)

taecongs 2023. 10. 18. 10:31

 


알고있으면 좋은 Typescript Tip✨


타입 단언 (Type Assertion)이란?

  • 타입스크립트가 추론하지 못하는 타입을 as키워드를 통해 명시해주는 것이다.
  • 실제 데이터 타입을 변경하지 않고 타입 에러가 나지 않게끔만 해준다.

 

(1)as 키워드 정의

  • as 키워드는 '컴파일' 단계에서 타입 검사를 할 때 타입스크립트가 감지하지 못하는 애매한 타입 요소들을 직접 명시해주는 키워드라고 볼 수 있다.
  • as 키워드는 오직 컴파일 단계에서만 실행되며 런타임 단계에서는 삭제된 채로 실행된다.
function setRainfall(target: HTMLElement, rf: rainFallData){
    const rainfallBefore: HTMLDivElement | null = target.querySelector(".before");
}

document.querySelector("#gp-rainfall") as HTMLElement, dummy.server[0].rainfall

 

(2)is 키워드 정의

  • is 키워드는 Type Guard(타입 가드)로, as가 특정 변수 하나에 국한된 것이라면 is 키워드는 한정된 범위 내의 모든 변수에 대해서 일괄적으로 적용할 수 있는 키워드이다
  • is 키워드도 마찬가지 컴파일 단계에서만 실행되며 런타임 단계에서는 삭제된 채로 실행된다.
function isString(test: any): test is string{
    return typeof test === "string";
}

function example(foo: any){
    if(isString(foo)){
        console.log("it is a string" + foo);
        console.log(foo.length);
    }
}

example("hello world");