[Javascript] 옵셔널 체이닝 (Optional chaining; ?.) 으로 다중 체크하기 / ?? 연산자

옵셔널 체이닝(Optional chaining; ?.)

을 사용하면 중첩 객체에 안전하게 접근할 수 있다

 

이는 최신 문법이므로 구식 브라우저는 확인이 필요하다

 

예를 들어 다음과 같은 코드를 실행한다고 가정하자

 

exchange.links.website.map(~);

 

exchange의 객체 배열에서 links 혹은 website가 있을 수도, 없을 수도 있다고 한다면

 

우리는 다음과 같이 && 연산자를 통해 트리플 체크를 해주어야 한다

 

exchange.links && exchange.links.website && exchange.links.website.map(~);

 

이처럼 참조가 누락될 가능성이 있는 경우 옵셔널 체이닝으로 더 짧고 간단한 표현식이 생성된다

 

exchange.links?.website?.map(~);

 

. 대신에 ?. 연산자를 사용함으로써,

 

exchange.links.website에 접근하기 전에 exchange.links가 null 또는 undefined가 아닌 것을 확인한다

 

만약 null 또는 undefined라면 이 표현식은 곧바로 undefined로 반환된다

 

---

 

또한, 다음과 같이 옵셔널 체이닝으로 연산 뿐만 아니라 함수 호출, 배열 접근 등 역시 가능하다

 

let result = someInterface.customMethod?.();

let arrayItem = arr?.[42];

 

---

?? 연산자

|| 연산과 의미는 같지만,

 

0값이나 "" 값에서 true값을 반환하고

 

null, undefined에서만 동작하도록 한다