Optional Chaning (?.)
이란?
- 프로퍼티가 없는 중첩 객체에서도 에러 없이 안전하게 접근할 수 있는 방법이다.
?.
의 앞 대상을 평가하여undefined
또는null
을 반환하면 평가를 멈추고undefined
를 반환한다.?.
의 앞 대상을 평가하여undefined
또는null
을 반환하지 않으면 해당 프로퍼티에 정상적으로 접근가능하다.
예시
let user = {}; // 주소 정보가 없는 사용자 alert(user.address.name); // TypeError: Cannot read property 'address' of undefined alert(user.address?.name); // undefined
user라는 빈 객체 생성 후 user
의 address
의 프로퍼티 내부의 name
을 출력할 때
address
가 존재하지 않고, name
또한 존재하지 않는다.
이럴 때 에러를 반환하는데 ?.
를 사용하여 프로퍼티 내부로 진입 시 에러 없이 undefined
를 반환받을 수 있다.
옵셔널 체이닝을 사용할 때 주의!!
?.
는 존재하지 않아도 괜찮은 대상에만 사용해야한다.- 위 예시에서 논리상
user
는 반드시 있어야 하는데address
는 필수값이 아니다.- 실수로 인해
user
에 값을 할당하지 않았다면 바로 알아낼 수 있도록 해야한다. 그렇지 않으면 에러를 조기에 발견하지 못하고 디버깅이 어려워진다.- 변수
user
가 선언되어있지 않으면user?.anything
평가시 에러가 발생한다. (user?.anything
을 사용하려면let
이나const
,var
를 사용해서user
를 정의해야 한다.- 옵셔널 체이닝은 선언이 완료된 변수를 대상으로만 동작한다.
요약
Obj?.prop
:Obj
가 존재하면Obj.prop
을 반환하고, 그렇지 않으면undefined
를 반환Obj?.[prop]
:Obj
가 존재하면Obj[prop]
을 반환하고, 그렇지 않으면undefined
를 반환Obj?.method()
:Obj
가 존재하면Obj.method()
을 호출하고, 그렇지 않으면undefined
를 반환?.
왼쪽 평가 대상이null
이나undefined
인지 확인하고null
이나undefined
가 아니라면 평가를 계속 진행한다.?.
를 계속 연결해서 체인을 만들면 중첩 프로퍼티들에 안전하게 접근할 수 있다.?.
은?.
왼쪽 평가대상이 없어도 괜찮은 경우에만 선택적으로 사용해야 한다.