티스토리 뷰

728x90
반응형

typescript의 optional property는 물론 매우 유용하게 쓰이는 경우가 많습니다

 

마치 치트키처럼말이죠

 

그런데 optional property는 사용하기가 매번 번거롭습니다

 

undefined인지 아닌지 매번 검증하는 로직을 넣어줘야 하기 때문입니다

 

optional 체이닝에서도 마찬가지로 주렁주렁 물음표를 달아주어야 합니다

 

response.posts[0].user?.profile?.smallPic

 

 

이런 interface가 있다고 가정해보죠

 

inteface Product {
  id: string;
  name: string;
  weight?: number;
}

 

상품중에서는 실물이 있는 상품인경우 무게를 표시하는 weight 프로퍼티가 있습니다

 

하지만 상품중에는 실물이 없는 디지털 상품도 있습니다 소프트웨어 씨리얼키나 이런것 말이죠

 

이런상황에서 가장 쉽게 설계하는 방법은 사용될지 안될지 모르는 애매모호한 필드들을 모두 optional로 만드는것입니다

 

가장 빠르고 쉽게 선택할수 있는 지름길입니다

 

그런데 종합쇼핑몰 급으로 취급하는 물건의 숫자가 많아진다면

 

optional 필드한 한 50개쯤 생기게될거예요(캐럿, 용량, 열량 등등...)

 

 

그럼 이런식으로 바꿔볼까요?

interface Product {
  id: string;
  name: string;
}

interface PyisicalProduct extends Product {
  weight: number;
}

 

optional 필드가 사라지면서 코드가 좀 더 명확하졌고 가독성도 높아졌습니다

 

우리에겐 항상 더 좋은 방법이 있군요

728x90
반응형
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함