타입 심화 5 - Type Guard 2 : 실습 문제 풀기

실습 문제까지만 풀고 아침 공부를 마치고 쉴 생각이다. 그럼 바로 타입 가드 문제를 풀어보겠다.

---

 

 

 

 

실습 3 - Type Guard

 

---

 

 

 

index.tx

---

 

 

 

discriminated-union.ts

---

 

 

 

다양한 연산자 살펴보기

 

1. instanceof

특정 클래스가 있을 때 클래스라는 Klass가 klass의 객체인지 알아볼 때 사용한다.

---

 

 

2. typeof

a라는 데이터가 원시타입 number와 동일한지 물을 때 사용한다.

---

 

 

3. in

어떤 객체가 있을 때 key라는 객체의 프로퍼티가 있는지 확인할 때 사용한다.

 

key에 프로퍼티가 있으니 true가 된다.

---

 

 

4. literal type guard

구체적인 값을 나타내는 것으로 리터럴을 사용하여 값을 구분한다. switch case나 if, else를 사용해도 된다.

---

 

 

 

5. 사용자 정의 함수

알 수 없는 타입의 value가 들어왔을 때 value의 타입이 undefined인지 사용자 정의 함수를 만들어 정의할 수 있다.

---

 

 

사용 예시

human 타입일 때 think() 메서드를 사용하려고 한다. think가 있는지 확인할 때는 in을 사용하면 된다. 

 

 

 

bark 메서드로 사용할 수 있고 동시에 쓰려면 다음과 같이 사용한다.

---

 

 

 

 

실습 문제 풀기

getData는 CustomResponse를 반환하고 있다. 내장함수가 0부터 1 사이의 랜덤함수를 반환한다. status가 성공했을 때는 true, 실패했을 때는 false를 준다.

 

 

 

ture일 때와 false일 때를 구분해서 출력문을 작성한다.

 

 

근데 response가 boolean 타입이므로 다음과 같이 간단하게 작성할 수도 있다.

---

 

 

 

코드 실행하기

 

 

실행하면 이처럼 true, false로 잘 출력된다.

---

 

 

 

 

학습을 마치고

이 실습 문제를 하나 푸는데 1시간은 걸린 것 같다. 문제가 많이 어려웠지만 그래도 배울 게 참 많은 수업이었다. 단순히 문제를 푸는 것이 아니라 이론 수업 때 배운 내용도 한번 복습하며 설명해 주셔서 개념 학습 때는 잘 이해하지 못했던 내용도 알게 되었다.

타입스크립트와 자바스크립트의 차이점도 이제는 알 것 같다.