TypeScript 타입 가드(Type Guards)

TypeScript는 정적 타입 언어로서 코드를 작성하는 동안 타입을 지정하고 검사하는 기능을 제공합니다. 이 과정에서 동적 데이터를 다룰 때 특정 타입인지 확인하는 작업이 필요할 수 있습니다. 이를 위해 TypeScript는 타입 가드(type guards)를 제공합니다. 이번 글에서는 타입 가드의 기본 개념과 다양한 활용 방법을 살펴보겠습니다.

타입 가드란 무엇인가?

타입 가드란 런타임에 변수의 타입을 좁히는(narrowing) 방법입니다. TypeScript는 코드에서 조건문을 통해 특정 타입을 확인하고, 확인된 타입에 따라 코드가 실행되도록 돕습니다. 타입 가드는 주로 다음과 같은 경우에 사용됩니다:

• 여러 타입을 가질 수 있는 변수에서 특정 타입만 처리하고 싶을 때
• 사용자 정의 타입이나 인터페이스를 검사해야 할 때

---

타입 가드의 기본 사용 방법

typeof를 이용한 기본 타입 검사

typeof는 JavaScript에서 제공하는 연산자로, 변수의 기본 타입을 확인할 때 유용합니다. TypeScript는 이를 활용해 타입 가드로 사용할 수 있습니다.

function printValue(value: string | number) {
  if (typeof value === 'string') {
    console.log(`문자열 값: ${value}`);
  } else if (typeof value === 'number') {
    console.log(`숫자 값: ${value}`);
  }
}

printValue("안녕하세요");
// 출력: 문자열 값: 안녕하세요

printValue(123);
// 출력: 숫자 값: 123

위 코드는 typeof를 사용해 value가 문자열인지 숫자인지를 판별하여 타입을 좁히는(narrow) 역할을 합니다.

---

instanceof를 이용한 클래스 타입 검사

instanceof는 객체가 특정 클래스의 인스턴스인지 확인할 때 사용됩니다.

class Dog {
  bark() {
    console.log("멍멍!");
  }
}

class Cat {
  meow() {
    console.log("야옹!");
  }
}

function makeSound(animal: Dog | Cat) {
  if (animal instanceof Dog) {
    animal.bark();
  } else if (animal instanceof Cat) {
    animal.meow();
  }
}

const dog = new Dog();
const cat = new Cat();

makeSound(dog); // 출력: 멍멍!
makeSound(cat); // 출력: 야옹!

위 코드에서는 instanceof를 통해 Dog와 Cat 타입을 식별하고, 올바른 메서드를 호출합니다.

---

사용자 정의 타입 가드

기본 제공 기능 외에도 사용자 정의 타입 가드를 만들어 특정 조건에 따라 타입을 확인할 수 있습니다. 사용자 정의 타입 가드는 is 키워드를 활용하여 구현합니다.

예제: is 키워드를 활용한 타입 확인

interface Fish {
  swim: () => void;
}

interface Bird {
  fly: () => void;
}

function isFish(animal: Fish | Bird): animal is Fish {
  return (animal as Fish).swim !== undefined;
}

function moveAnimal(animal: Fish | Bird) {
  if (isFish(animal)) {
    animal.swim();
  } else {
    animal.fly();
  }
}

const fish: Fish = { swim: () => console.log("물속에서 헤엄칩니다.") };
const bird: Bird = { fly: () => console.log("하늘을 날아갑니다.") };

moveAnimal(fish); // 출력: 물속에서 헤엄칩니다.
moveAnimal(bird); // 출력: 하늘을 날아갑니다.

타입 가드 함수의 구조

타입 가드 함수는 다음과 같은 구조를 가집니다:

• 매개변수: 검사할 변수
• 반환값: animal is Type 형태의 반환값

function isType(value: any): value is 특정타입 {
  return 조건;
}

---

in 연산자를 활용한 객체 프로퍼티 확인

in 연산자는 객체에 특정 프로퍼티가 존재하는지 확인합니다. 이를 통해 타입을 좁힐 수 있습니다.

interface Admin {
  role: string;
}

interface User {
  name: string;
}

function getUserInfo(person: Admin | User) {
  if ('role' in person) {
    console.log(`관리자 역할: ${person.role}`);
  } else {
    console.log(`사용자 이름: ${person.name}`);
  }
}

const admin: Admin = { role: "superadmin" };
const user: User = { name: "홍길동" };

getUserInfo(admin); // 출력: 관리자 역할: superadmin
getUserInfo(user); // 출력: 사용자 이름: 홍길동

---

유니언 타입과 타입 가드의 활용

유니언 타입은 여러 타입 중 하나를 가질 수 있는 변수입니다. 타입 가드를 활용하면 코드에서 유니언 타입을 안전하게 처리할 수 있습니다.

예제: 유니언 타입 처리

type Shape = Circle | Rectangle;

interface Circle {
  radius: number;
}

interface Rectangle {
  width: number;
  height: number;
}

function getArea(shape: Shape) {
  if ('radius' in shape) {
    return Math.PI * shape.radius * shape.radius; // 원의 넓이
  } else {
    return shape.width * shape.height; // 사각형의 넓이
  }
}

const circle: Circle = { radius: 10 };
const rectangle: Rectangle = { width: 10, height: 20 };

console.log(getArea(circle)); // 출력: 314.1592653589793
console.log(getArea(rectangle)); // 출력: 200

---

결론

타입 가드는 TypeScript의 강력한 기능 중 하나로, 타입 안전성을 유지하면서 다양한 타입을 처리할 수 있게 도와줍니다. typeof, instanceof, in 연산자와 사용자 정의 타입 가드를 적절히 활용하면 더욱 안전하고 가독성 높은 코드를 작성할 수 있습니다.