Typescript Narrowing 타입 사용할 때 주의😈

 

코드를 짤 때 애매한 타입은 단번에 에러 잡아내주시는 이 타입스크립트에는 

 

Narrowing 과 Never 타입이 있는데, 

 

Narrowing은 애매한 타입에서 

Narrowing : "조건문으로 하나만 타입지정해" 여기 이거, typeOf 써. 라고했지만

 

typeOf연산자로는 할 수 없는 상황들이 있다. 그럴 땐 어떻게 해야할까?

 

 

| typeOf 연산자말고 &&

아까말한 애매한 상황이라는 것은 

null | undefined

로 타입을 체크하는 경우이다. 이럴 때 &&를 사용한다면

function 함수(x :string | undefined){

    // 만약 x가 undefined면 이렇게 실행하라
    // 만약 x가 null이면 이렇게 실행하라
    //if문을 2개 써야하는데
    
    //이런 방법도 있다. &&를 사용해서 여러 if문을 쓰는 것을 줄일 수 있다는 것
    if(x && typeof x === 'string'){

    }
}

이렇게 한다면 변수 x가 undefined라면 undefined가 남아 if문이 실행하지 않는다.

변수 x가 string 타입일 때 if문이 실행되지요.

 

null, undefined인 경우를 쉽게 알고 거를 수 있는 문법입니다. &&

 

 

 

| in 키워드

함수안에 파라미터가 하나들어온 경우이며 파라미터 타입은 Fish | Bird 타입만 들어올 수 있는 이 코드를 보면

type Fish ={swim : string}
type tiger = {run : string}

function 함수(animal : Fish | tiger){
   // animal.swin 하면 에러가 난다. 
}

 

에러가 나는 이유?

animal은 아직 애매하기 때문에 타입스크립트는 에헴!하고 에러내는 거지요.

if(typeof animal === 이렇게 typeof를 쓸 때 알아두어야할 것이 )

number, string, boolean, object 이런 식으로만 판정가능 

따라서 이 상황에서는 typeOf 사용아 안된다.

 

 

이럴 때 in 키워드를 사용하는데 in을 사용할 때 조건은 

서로 배타적인 속성을 가지고 있는 타입들, 다른 속성을 가지고 있는 타입들은 in키워드를 사용한다는 것이죠.

type Fish ={swim : string}
type tiger = {run : string}

function 함수(animal : Fish2 | tiger){
    if('swim' in animal){
    }
}

사용법 : 속성명 in 오브젝트자료