[TypeScript] 타입 가드 (Type Guard)

타입 가드 (Type Guard)

  - 변수가 여러 개의 타입으로 지정되어 있을 때, 특정 조건을 기반으로 변수의 타입 범위를 좁히는 기법

  - 코드 흐름에 따라 타입을 좁혀서 특정 타입에 대한 처리를 더 정확하게 할 수 있도록 함  

 

 

---

# typeof 연산자

  - 기본 자료형 확인

     ex) string, number, boolean, object, ...

function example(x: number | string) {
    if (typeof x === "string") {
        // 여기서 x는 string 타입으로 좁혀지며, string 타입 관련 함수가 자동완성됨
        console.log(x.toUpperCase());
    }
}

# instanceof 연산자

  - 객체가 특정 클래스의 인스턴스인지 확인

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

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

function speak(animal: Dog | Cat) {
    if (animal instanceof Dog) {
        // 여기서 animal은 Dog 타입으로 좁혀짐
        animal.bark();
    }
}

# in 연산자

  - 객체가 특정 프로퍼티를 가지고 있는지 확인

interface Dog {
    bark: () => void;
}

interface Cat {
    meow: () => void;
}

function speak(animal: Dog | Cat) {
    if ("bark" in animal) {
        // 여기서 animal은 Dog 타입으로 좁혀짐
        animal.bark();
    }
}

 

# 사용자 정의 타입 가드 함수 (is 연산자 활용)

// return 값이 true이면 value는 string 타입으로 좁혀짐
function isString(value: number | string): value is string {
    return typeof value === "string";
}

function example(x: number | string) {
    if (isString(x)) {
        // 여기서 x는 string 타입으로 좁혀짐
        console.log(x.toUpperCase());
    }
}

 

---

구별된 유니언 타입 (Discriminated Union Type)

  - 공통의 식별자 프로퍼티를 통해, 유니언 타입으로 묶인 각 타입들을 구별할 수 있도록 함

interface Dog {
    type: "dog";  // 식별자
    bark(): void;
}

interface Cat {
    type: "cat";  // 식별자
    meow(): void;
}

type Animal = Dog | Cat;

function speak(animal: Animal) {
    if (animal.type === "dog") {
        // animal은 Dog 타입으로 좁혀짐
        animal.bark();
    } else {
        // animal은 Cat 타입으로 좁혀짐
        animal.meow();
    }
}