TypeScript) 타입가드

타입 가드 - typeof

typeof 조건식으로 처리되는 타입을 방어하는 코드이다. 주로 조건문으로 구성된다.

타입스크립트는 null이나 undefined의 가능성, 패러미터에 다른 타입이 들어올 가능성들을 추적하여 사용자에게 경고한다.

function add(a: Combinable, b: Combinable): Combinable {
  if (typeof a === "string" || typeof b === "string") { // 조건식으로 처리되는 타입을 방어.
    return a.toString() + b.toString();
  }
  return a + b; // must be Number
}

If 문에 typeof를 활용하여 a가 문자거나, b가 문자인 경우를 걸러주었다. 그러니 마지막 return a + b는 자동적으로 숫자가 되고,

타입스크립트가 이를 인식해서 경고를 없앤다.

 

 

타입 가드 - if ( prop in obj ) ...

이때, 자바스크립트 처럼 truthy/falshy값을 이용해 검사하고 싶을때도 있을 것이다.

그러나 객체일 경우 객체의 속성을 타입 가드로 쓰려면 약간의 불편함이 발생한다.

function printEmployeeInformation(emp: unKnownEmployee) {
  console.log("Name: ", emp.name)
  if (emp.privilages) { // 똘추같은 타입스크립트는 이런 식의 체크조차 못하게 한다.
	...
  }
}
// typeof emp를 해봤자 employee가 나온다.
// typeof는 커스텀 타입을 모른다.

패러미터인 emp는 unknownEmployee라는 '커스텀 타입'이다.

그리고 함수 안에서 객체에서 속성이 있는지 없는지를 비교하기 위해 if (obj.prop)를 쓰려고 했는데... 할 수 없다.

emp.privilages가 있는지 없는지를 검사조차 못하게 하는 것이다.

없을 수 있는 가능성이 조금이라도 있으면, 타스는 이걸 접근조차 막아버린다ㅠㅠ

 

그렇다고 typeof를 해봤자 “object”밖에 안 나오기 때문에 typeof 검사도 불가능하다.

(기본적으로 자스는 커스텀 타입을 모른다)

 

 

이건 원래 자바스크립트 코드인데 in을 써서 프로퍼티 키를 가져올 수 있다.

(for문에서 for - in을 쓰는건 봤는데… 타입 가드로 이렇게 쓰일수도 있다는게 놀랍다.)

  if ("previlages" in emp) {
     ...
  }

 

 

타입 가드 if ( a instanceof className )

for in으로 처리하는 방법 말고도 instanceof를 활용하는 방법도 존재한다.

어떤 프로퍼티가 있는지 확인하는게 아니라 어떤 클래스의 인스턴스인지를 확인한 다음에

해당 클래스라면 가지고 있어야할 프로퍼티를 활용하는 것이다.

for in보다 오타의 가능성도 적다는 장점이 있다.

class Car {
  drive() {
    console.log("Driving...");
  }
}

class Truck {
  drive() {
    console.log("Driving a truck...");
  }

  loadCargo(amount: number) {
    console.log("Loading Cargo ... " + amount);
  }
}

type Vehicle = Car | Truck;

const v1 = new Car();
const v2 = new Truck();

function useVehicle(vehicle: Vehicle) {
  vehicle.drive();
  if ("loadCargo" in vehicle) {
    vehicle.loadCargo(500);
  }
  if (vehicle instanceof Truck) { //이건 prop in obj보다 오타의 가능성도 더 적다.
    vehicle.loadCargo(5000);
  }
}