[JS] 옵셔널 체이닝 `?.`

jYur·2022년 11월 3일
0

코틀린에도 있는 문법. 그러나 백엔드의 경우, 통제 가능한 영역에서는 최대한 nullable type을 줄이고, 통제가 어려운 데이터는 가능하면 받자마자 처리 후 내부적으로는 non-nullable type으로 다루는 것이 편하다고 생각한다.
그래서 지금까지는 사용할 일이 많이 없었지만.. 프론트엔드에서는 사용할 일이 종종 있을 것 같아서 한번 알아보았다.


다음과 같은 users가 있다.
nameB, E인 element(user)는 address라는 프로퍼티가 없다.

이때, 아래처럼 addressstreet에 접근하려고 하면 에러가 발생한다.

nameB, E인 user의 addressundefined이기 때문에
루프를 돌다 보면 u.address.street이라는 코드가 u.undefined.street이 되기 때문.

옵셔널 체이닝(?.)이 없을 때 사용했던 해법

u.address && u.address.street

옵셔널 체이닝(?.)을 사용한 해법

u.address?.street
해석: 'address'가 undefined 또는 null이야'?' 그럼 이 부분(u.address?.street)은 그냥 undefined라고 하자)

호출하는 함수가 없을 수도 있다면

참고) Object에 함수 넣는 법

{ foo() {} }

또는

{ foo: () => console.log('foo') }

아래처럼, 호출할 때 ()대신 ?.() 사용하여 해결

프로퍼티 접근 시 []를 사용하는 경우

?.[]도 된다.

0개의 댓글