[TypeScript] type guard 만드는 방법

[TypeScript] type guard 만드는 방법

type guard

타입스크립트에서 변수의 타입을 판단할 때, 주로 타입 가드(Type Guard)를 활용합니다.
원시 값, 배열, 날짜 객체 등을 판단하는 경우, 다음과 같은 타입 가드를 사용할 수 있습니다.

원시 값, 배열, 날짜 객체 판단하는 방법

function isNumber(value: any): value is number {
  return typeof value === "number";
}

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

function isBoolean(value: any): value is boolean {
  return typeof value === "boolean";
}

function isSymbol(value: any): value is symbol {
  return typeof value === "symbol";
}

function isNull(value: any): value is null {
  return value === null;
}

function isUndefined(value: any): value is undefined {
  return value === undefined;
}

function isArray(value: any): value is any[] {
  return Array.isArray(value);
}

function isDate(value: any): value is Date {
  return value instanceof Date;
}

사용하는 방법

let testValue: any;

// Number 타입 테스트
testValue = 123;
if (isNumber(testValue)) {
  console.log("Number 타입입니다.");
} else {
  console.log("Number 타입이 아닙니다.");
}

// String 타입 테스트
testValue = "hello";
if (isString(testValue)) {
  console.log("String 타입입니다.");
} else {
  console.log("String 타입이 아닙니다.");
}

// Boolean 타입 테스트
testValue = true;
if (isBoolean(testValue)) {
  console.log("Boolean 타입입니다.");
} else {
  console.log("Boolean 타입이 아닙니다.");
}

// Symbol 타입 테스트
testValue = Symbol("test");
if (isSymbol(testValue)) {
  console.log("Symbol 타입입니다.");
} else {
  console.log("Symbol 타입이 아닙니다.");
}

// Null 타입 테스트
testValue = null;
if (isNull(testValue)) {
  console.log("Null 타입입니다.");
} else {
  console.log("Null 타입이 아닙니다.");
}

// Undefined 타입 테스트
testValue = undefined;
if (isUndefined(testValue)) {
  console.log("Undefined 타입입니다.");
} else {
  console.log("Undefined 타입이 아닙니다.");
}

// Array 타입 테스트
testValue = [1, 2, 3];
if (isArray(testValue)) {
  console.log("Array 타입입니다.");
} else {
  console.log("Array 타입이 아닙니다.");
}

// Date 타입 테스트
testValue = new Date();
if (isDate(testValue)) {
  console.log("Date 타입입니다.");
} else {
  console.log("Date 타입이 아닙니다.");
}

위처럼 하면 간단하게 타입을 확인할 수 있습니다.