옵셔널 체이닝 ?.

1. 렌더링되는 화면과 데이터를 불러오는 시간 차이 해결

옵셔널 체이닝으로 React의 life cycle로 인해 발생하는 undefined 문제를 경우에 따라 간단하게 해결할 수 있습니다.
옵셔널체이닝은 ?.앞의 평가대상이 undefined나 null이면 평가를 멈추고 undefined를 반환하게 됩니다.

undefined로 인한 렌더 오류가 있을 때 옵셔널체이닝을 적용하면 데이터를 불러온 뒤에 화면에 렌더링 되도록 합니다.

 

2. 디버깅을 어렵게 하니 존재하지 않아도 되는 값에만 사용

하지만 많은 경우에 undefined가 존재할 수 있기 때문에 남용을 하게 되면 나중에 디버깅이 힘들어지게 됩니다.

따라서 평가대상이 존재하지 않아도 상관이없는, 예를 들어 특정 객체의 속성 중요하지 않은 속성과 같은 경우에 선택적으로 사용하도록 조심성을 요합니다..

ex)
user001은 interest에 정보를 입력했지만, 다른 user002는 interest에 아무런 정보도 입력하지 않았습니다.

이 때 user.interest.music 으로 접근하려 하면  user001은 pop이 잘 나오지만 user002의 경우에는 존재하지 않는 값에 접근하려 했기 때문에 에러가 발생할 수 있습니다.

하지만 interest는 반드시 필요로하는 요소가 아니라면 옵셔널 체이닝을 이용해 user.interest?.music과 같이 interest가 존재하지 않지만 undefined를 반환받을 수 있게 됩니다.

*이렇게 에러를 잡아 편리하기도 하지만, 동시에 에러를 잡기 어렵도록 하는 모순적인 녀석이니 주의를 요합니다.