[TypeScript] 타입 확정 Narrowing & Assertion

https://codingapple.com/course/typescript-crash-course/

빠르게 마스터하는 타입스크립트 - 코딩애플 온라인 강좌

본 블로그는 해당 타입스크립트 강의(코딩애플) 수강 후, 작성된 게시물입니다.

---

Narrowing

Type이 하나로 확정되지 않았을 경우, 데이터를 처리하고 싶을때 type을 하나로 정하는 것

Narrowing 할 수 있는 문법
[1] typeof 변수
[2] 속성명 in 오브젝트자료
[3] 인스턴스 instanceof 부모

타입이 확실하지 않을 때 생기는 부작용을 막기 위해 사용하는 Narrowing방식은 "detensive하게 코딩한다." 라고 하기도 한다.

 

 

[1] typeof 변수

function 함수(x :number|string){
    if(typeof x === 'number'){
    	x = x + 1;
    } else {
    	x = x + 'good';
    }
}

※ typeof는 string을 반환하기 때문에 if(typeof x === number) 가 아닌 if(typeof x === 'number')로 써야한다.
또한, if문을 사용할때 else까지 써야 안전하다.

union type에서 연산을 해주지 않는다.

---

narrowing을 통해 타입을 정하면 다음과 같이 오류가 나지 않는 걸 확인할 수 있다.

 

---

 

number 배열에 x 파라미터를 집어넣으면 오류가 발생한다. 타입스크립트는 엄격하기 때문에 x는 union type이므로 type이 불확실하다고 판단한다.

---

narrowing을 통해 타입을 확정지어준다.

 

 

 

[2] 속성명 in 오브젝트자료

type 객체1 = { age: number }
type 객체3 = { name: string }

function 함수(x :객체1|객체2){
	if('age' in x){
    	x.age = 1;
    } else {
    	x.name = 'yuna';
    }
}

타입으로 지정된 객체를 union type의 파라미터 변수로 받을때, Animal과 Person 타입 모두 number type의 age라는 Key를 가지고 있다면 아무런 문제가 되지 않는다.

 

문제가 되는 코드▼

age의 타입이 string과 number로 다르다면, 오류가 발생한다.

하나의 객체에만 age 키가 존재한다면, 오류가 발생한다.

 

해결 코드▼

두번째 함수에서 보듯이 in을 사용하여 narrowing을 한 것을 확인할 수 있다.

 

 

 

 

[3] 인스턴스 instanceof 부모

class 클래스1 { 하나 :boolean }
class 클래스2 { 둘 :boolean }
function 함수(x :클래스1|클래스2){
  if(x instanceof 클래스2)
    x.둘 = true;
}

파라미터가 클래스로 이루어진 union type이기 때문에, 파라미터에 나무꾼이 들어온다면 총이 없다.

그래서 Instanceof로 narrowing을 하여 총을 가진 사냥꾼만 들어오도록 한다.

 

---

Assertion

타입 덮어쓰기(타입 실드 임시 해제용)

function 함수(x :number|string){
	let a :string;
    a = x as string;	// Assertion
}

Assertion 용도
1. Narrowing할때 사용
→ union type을 하나로 확정할때!

잘못된 사용
→ primitive type을 다른 타입으로 바꿔서 사용할 수 없다.

let 이름 :string = 'park';
이름 as number; // error​

2. 들어올 타입이 100% 확신할때 사용

다음과 같이 as를 통해 assertion을 사용할 수 있다.