TS Casting

라이브러리에서 잘못된 유형을 제공하는 경우와 같이 변수 타입을 재정의해야 하는 타입으로 작업할 때 때가 있다.

캐스팅은 타입을 재정의하는 프로세스다.

Casting with as

변수를 캐스팅하는 직접적인 방법은 as 키워드를 사용하는 것이다. 주어진 변수의 타입을 직접 변경한다.

• 캐스팅 했을 때
  
• 캐스팅 안했을 때
  

캐스팅은 실제로 변수 내의 데이터 유형을 변경하는 것은 아니다. 예를 들어 아래 코드는 변수 x에 여전히 숫자가 있기 때문에 예상대로 작동하지 않는다.

let x: unknown = 4;
console.log((x as string).length); 
// prints undefined since numbers don't have a length

TS는 올바르지 않은 캐스트를 방지하기 위해 여전히 typecheck 캐스팅를 시도한다. 예를 들어 TS는 데이터를 변환하지 않고는 문자열을 숫자로 캐스팅하는 것이 의미가 없다는 것을 알기 때문에 다음과 같은 형식 오류가 발생한다.

console.log((4 as string).length); 
// Error: Conversion of type 'number' to type 'string' may be a mistake because neither type sufficiently overlaps with the other. 
//If this was intentional, convert the expression to 'unknown' first.

아래 단원의 강제 캐스팅 섹션에서는 이를 재정의하는 방법을 설명한다.

Casting with <>

<>를 사용하는 것은 as로 캐스팅하는 것과 동일하게 작동한다.

이러한 유형의 캐스팅은 React 파일에서 작업할 때와 같이 TSX에서 작동하지 않는다.
.tsx : 타입스크립트를 사용하는 리액트 컴포넌트 확장자?

Force casting

TS가 캐스팅할 때 발생할 수 있는 타입 오류를 재정의하려면 먼저 unknown으로 캐스팅한 다음 대상 타입으로 캐스팅한다.