[TypeScript] 타입 단언

타입 단언 (Type Assertion)

타입 단언은 타입스크립트에서 컴파일러의 타입 추론을 무시하고, 개발자가 직접 변수나 표현식의 타입을 지정할 때 사용됩니다. 이를 통해 코드의 의도를 명확히 하거나 타입스크립트가 추론하지 못하는 상황헤서 강제로 타입을 부여할 수 있습니다.

---

타입 단언 문법

as

타입 단언은 as 키워드를 사용하여 표현합니다.

let someValue: unknown = "Hello, TypeScript";

let strLength: number = (someValue as string).length;

console.log(strLength); // 16

<>

as 외에서 <> 꺽쇠 문법을 사용하여 타입 단언을 할 수 있습니다. 하지만 이 방식은 JSX와 충돌할 수 있으므로 JSX를 사용하는 경우에는 as 키워드를 사용하는 것이 권장됩니다.

let someValue: unknown = "Hello, TypeScript";

let strLength: number = (<string>someValue).length;

console.log(strLength); // 16

---

타입 단언은 언제 사용하는가 ?

1. 타입 추론이 정확하지 않을 때

타입스크립트가 추론한 타입이 개발자의 의도와 다를 경우, 타입 단언으로 타입을 지정합니다.

let input = document.getElementById("username") as HTMLInputElement;
input.value = "TypeScript";

2. unknown 또는 any 타입의 값을 구체적으로 지정할 때

unknown이나 any 타입은 컴파일러가 타입을 알 수 없으므로, 단언을 통해 적절한 타입으로 변환합니다.

let data: any = "Hello";
let dataLength: number = (data as string).length;

3. 함수의 반환 타입을 강제할 때

함수가 특정 타입을 반환한다는 것을 보장하지만, 컴파일러가 이를 추론하지 못할 때 사용합니다.

function getElement(): HTMLElement | null {
  return document.querySelector("div");
}

let element = getElement() as HTMLDivElement;
element.style.color = "red";

---

타입 단언의 주의점

타입 단언은 개발자의 의도를 강제로 컴파일러에 전달하기 때문에, 잘못 사용할 경우 런타임 에러이 발생할 수 있습니다.

1. 잘못된 타입 단언

let numValue = 100;
let strValue = numValue as string;

2. 이중 단언

이중 단언은 타입스크립트의 강력한 타입 검사를 우회할 수 있으므로 권장되지 않습니다.

let value: any = "Hello";
let numValue = value as unknown as number;

3. 단업보다는 타입 가드를 우선 사용

타입 단언은 최후의 수단으로 사용하는 것이 좋으며, 가능하다면 타입 가드를 사용하는 것이 권장됩니다.

function isString(value: unknown): value is string {
  return typeof value === "string";
}

let value: unknown = "Hello";
if (isString(value)) {
  console.log(value.length); // 안전하게 처리
}

---

요약

• 타입 단언은 타입스크립트의 추론을 무시하고, 개발자가 명시적으로 타입을 지정하는 방법입니다.
• as와 <>를 사용하지만, JSX에서는 as를 권장합니다.
• 잘못된 사용은 런타임 에러를 발생하므로 신중하게 사용해야 합니다.
• 가능한 타입 가드를 우선적으로 활용하는 것이 좋습니다.

---

✅ 참고

• 타입 단언 | 타입스크립트 핸드북_캡틴판교
• [TypeScript] 타입 추론과 타입 단언_Main