TypeScript-섹션3. 타입스크립트 이해하기- 타입 좁히기(8)

손주완·2025년 7월 9일

TypeScript Section3

목록 보기
7/8

선요약

✅ 1. typeof – 기본형(primitive type) 확인할 때 사용 (객체나 배열 불가)
✅ 2. instanceof – 클래스 인스턴스인지 확인할 때 사용
✅ 3. in – 속성(key)의 존재 여부로 타입 구분할 때 사용

1. 타입 좁히기

function func(value: number | string) {
  value.toFixed() // 오류
	value.toUpperCase() // 오류
}

위와 같이 확정되지 않은 타입에 메서드를 사용하면 오류 발생.
-> 조건문을 통해 보장 필요

function func(value: number | string) {
  if (typeof value === "number") {
    console.log(value.toFixed());
  } else if (typeof value === "string") {
    console.log(value.toUpperCase());
  }
}

2. instanceof 타입가드

instanceof를 이용하면 내장 클래스 타입을 보장

function func(value: number | string | Date | null) {
  if (typeof value === "number") {
    console.log(value.toFixed());
  } else if (typeof value === "string") {
    console.log(value.toUpperCase());
  } else if (value instanceof Date) {
    console.log(value.getTime());
  }
}

3. in 타입 가드

우리가 직접 만든 타입과 함께 사용하려면 다음과 같이 in 연산자를 이용

type Person = {
  name: string;
  age: number;
};

function func(value: number | string | Date | null | Person) {
  if (typeof value === "number") {
    console.log(value.toFixed());
  } else if (typeof value === "string") {
    console.log(value.toUpperCase());
  } else if (value instanceof Date) {
    console.log(value.getTime());
  } else if (value && "age" in value) {
    console.log(`${value.name}은 ${value.age}살 입니다`)
  }
}

0개의 댓글