Type Script - 6

넓은 타입에서 좁은 타입으로 타입을 좁히는 과정에 대해 알아보자

타입 좁히기

function func1 (value: string | number) {
  value.toFixed();
  value.toUpperCase();
}

위와 같은 함수가 있고 value의 타입은 string, number 로 되어있기에 해당 타입에 대한 메서드를 실행을 하면 오류를 발생한다.

• value는 string, number가 합쳐진 타입을 기대하는 반면 해당 메서드는 각각의 타입에서만 독립적으로 쓸 수 있는 메서드이기 때문이다
  그렇기에 다음과 같이 조건문을 통해 타입을 좁혀서 사용을 할 수 있다.

function func1 (value: string | number) {
	if(typeof value == "string") {
		value.toUpperCase();
    } else if (typeof value == "number") {
    	value.toFixed
    }
}

• 위와 같이 조건문을 이용해 조건문 내부에서 변수가 특정 타입임을 보장해주기에 이를 통해 타입이 좁혀질 수 있다.

instanceof

instanceof를 통해 내장 클래스 타입에 대한 타입 좁히기가 가능하다.

function func2(value: Date | null) {
	if(typeof value == "object") {
    	value.getTime();
    }
}

위 코드는 오류를 발생을 한다 왜일까? 전 처럼 타입을 조건문을 통해 좁혔는데,,
value값을 보게 되면 null일 수 있기때문이다 그럼 이러한 내장 클래스에 대해선 어떻게 타입을 좁힐 수 있을까?

function func2(value: Date | null) {
	if (value instanceof Date) {
    	value.getTime();
  }
}

• instanceof 를 사용하면 내장 클래스의 타입을 보장할 수 있게 된다.
• instanceof 를 우리가 직접 만든 클래스에는 사용할 수 없다.

in type guard

우리가 직접 만든 클래스에 타입을 보장 하려면 in을 사용하여 좁힐 수 있다.

type Glass = {
	name: string;
  	color: string;
}

function func3(value: Glass | null) {
	if (value && "color" in value) {
    	console.log(value.name)
    }
}

• 위와 같이 value의 타입을 우리가 만든 타입에 대해 적용을 하고 싶다면
  value값이 존재하고 && value값이 우리가 만든 타입안의 값이 있는지에 대한 여부를 검사한다.