TypeScript를 사용하면서 굉장히 많이 사용되기는 하지만 기존에 추상적으로만 개념을 알고있어서 친구에게 이와 관련한 개념을 설명하는데 어려움을 느꼈었다.
이번기회에 optional chaining에 대하여 알아보도록 해야겠다.
1. Optional chaining
존재하지 않을 수도 있는 프로퍼티 또는 메소드를 안전하게 호출할 수 있도록 도와준다.
const user = {
name : "kang"
id : 1
}db에서 위와 같은 json data를 불러온다고 가정해보겠다.
const response = fetch(...API주소) // ..fetch과정 중략 reponse?.user
이런식으로 사용될 수 있다.
fetch하는 과정에서 optional chaining을 사용하지 않으면 에러가 발생한다.
왜냐하면 api를 통해 데이터를 불러오는 과정은 비동기적으로 진행되기 때문에 아직 데이터를 불러오지 않았는데 이 데이터에 접근하려고 해서 생기는 문제이다.
따라서 optional chaining을 사용해서 undefined 혹은 null 접근 오류를 방지할 수 있다.