​개요

여러가지를 통해 api로 값을 받아올때면 일부 값은 누락되어 오는 경우가 허다하게 발생하는데,

이번에는 타입스크립트의 선택적 타입 정의를 통해 특정 값이 누락되어도 타입 정의를 통해 추론이 잘 이루어질 수 있게끔 해보겠습니다!

선택적 타입 정의?

타입을 정의하게 되면 해당 타입과 관련된 값이 꼭 존재해야하는 불편함이 있는데

선택적 타입 정의를 사용하게 되면 값의 존재 유무에 따라 타입을 검사해주는 고마운 친구였습니다 ㅎ

​​사용방법

​코드보기

export type UserCardProps = {
    name: string;
    age?: number; // 선택적 props
    skills?: string[]; // 선택적 배열 props
}

선택적 타입 정의를 위해서는 원하시는 값에다가 ?를 뒤에 붙여주시면 됩니다.

그럼 아래와 같은 상황에서 age가 없으면 타입 추론을 안하게 되며,

age 존재시 age의 타입이 number인지 추론을 하게 됩니다.

코드보기

export const UserCard = ({ name, age, skills = [], address }: UserCardProps) => {}​​

마치며

알면 알수록 편리하고 다양한 기능이 타입스크립트에 있는거 같네요

정말 스크립트의 세계는 방대하네요...