본문 바로가기
부트캠프교육중/TypeScript

[TS] 타입 가드

by 뭉지야 2023. 8. 18.
728x90
interface Developer {
    name: string;
    skill: string;
}

interface Person {
    name: string;
    age: number;
}

function introduce(): Developer | Person {
    return { name: 'tony', age: 33, skill: 'Iron Making' }
}
let tony = introduce();
console.log(tony.skill);    // 오류
console.log(tony.age);      // 오류
console.log(tony.name);      // 정상

 

return 값에 skill이 있음에도 오류표시나는 이유는 유니언타입으로 해서 공통된 속성만 된다.

그래서 name만 된다.

 

만약 skill을 이용하고 싶으면 이렇게 사용하면 된다.

if((tony as Developer).skill){
    console.log((tony as Developer).skill)
} else if((tony as Person).age){
    console.log((tony as Person).age)
}

 

근데 너무 복잡하다. 그래서 타입가드를 이용하는거다!!!

 

 

 

 

# 타입가드를 이용한 타입구분방식

function isDeveloper(target: Developer | Person): target is Developer {
    return (target as Developer).skill !== undefined;
}
if(isDeveloper(tony)){
    tony.skill
} else {
    tony.age
}
728x90

'부트캠프교육중 > TypeScript' 카테고리의 다른 글

[TS] TS에서 props하는법  (0) 2023.08.18
[TS] 타입 호환  (0) 2023.08.18
[TS] 타입 단언  (0) 2023.08.18
[TS] 타입 추론  (0) 2023.08.17
[TS] Promise에서의 제네릭  (0) 2023.08.17