[typescript] 타입 가드 함수와 타입스크립트의 호환성

15 Dec 2023

typescript

타입 가드 함수(Type guard function)는 특정 변수의 타입을 확인하고, 타입스크립트에서 유용하게 활용할 수 있는 기능입니다. 이 글에서는 타입 가드 함수를 사용하는 방법과 타입스크립트의 호환성에 대해 설명하겠습니다.

타입 가드 함수란 무엇인가요?

타입 가드 함수는 런타임 중에 변수의 타입을 확인하는 함수입니다. 보통 조건문, instanceof 연산자, in 연산자 등을 사용하여 변수의 타입을 확인하고 해당 변수를 해당하는 타입으로 변환해주는 역할을 합니다.

예를 들어, 다음과 같은 코드가 있습니다.

interface Circle {
  kind: "circle";
  radius: number;
}

interface Square {
  kind: "square";
  sideLength: number;
}

function getArea(shape: Circle | Square) {
  if (shape.kind === "circle") {
    // shape은 Circle 타입으로 간주됨
    return Math.PI * shape.radius ** 2;
  } else {
    // shape은 Square 타입으로 간주됨
    return shape.sideLength ** 2;
  }
}

위의 코드에서 shape 변수의 타입을 확인하여 해당하는 타입으로 사용되는 부분이 타입 가드 함수를 활용한 예시입니다.

타입스크립트의 타입 호환성

타입스크립트는 서로 다른 두 개의 타입이 서로 할당 가능한지를 확인하는 “타입 호환성”에 대한 규칙을 가지고 있습니다. 타입 가드 함수를 이용하여 타입을 확인하고, 해당 타입에 맞게 변수를 적절히 할당함으로써 타입 호환성을 유지할 수 있습니다.

예를 들어, 다음 코드는 타입 가드 함수를 사용하여 타입 호환성을 유지하는 예시입니다.

interface Bird {
  fly(): void;
  layEggs(): void;
}

interface Fish {
  swim(): void;
  layEggs(): void;
}

function getPet(): Bird | Fish {
  // ...
}

let pet = getPet();
if ("fly" in pet) {
  // pet은 Bird 타입으로 간주됨
  pet.fly();
} else {
  // pet은 Fish 타입으로 간주됨
  pet.swim();
}

위의 코드에서, getPet 함수는 Bird 또는 Fish 중 하나를 반환하며, 반환된 값을 타입 가드 함수를 활용하여 적절히 처리하고 있습니다.

타입 가드 함수를 잘 활용하면 타입스크립트의 타입 호환성을 유지하면서 더욱 안전하고 효율적인 코드를 작성할 수 있습니다.