[JavaScript] ?. 연산자 - Optional Chaining
객체의 속성값에 접근하기 위해서는
.
연산자를 사용하였다. 하지만 경우에 따라 깊게 접근하면 제일 앞에 객체에서 값을 읽어올수 없을때 undefined 에러가 발생했다. 그럴때마if
문을 통해 경우의 수를 두었는데 같이 진행하는 팀원 "토스 SLASH 2021"에서 본?.
연산자를 알려주었고 적용하였다.
?. 연산자란?
- 인의 각 참조가 유효한지 명시적으로 검증하지 않고, 연결된 객체 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있다.
?.
연산자는.
체이닝 연산자와 유사하게 작동하지만, 만약 참조가nullish (en-US)
(null 또는 undefined)이라면, 에러가 발생하는 것 대신에 표현식의 리턴 값은undefined
로 단락된다. 함수 호출에서 사용될 때, 만약 주어진 함수가 존재하지 않는다면, undefined를 리턴한다. undefined
나null
인 경우에TypeError
대신에undefined
를 얻게 됩니다.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Optional_chaining
적용 경우
- 만약 Redux의 user객체를 사용한 코드를 작성한다고 예를 들겠다. user안의 이름을 알고 싶다.
- 기존에 작성했던 코드라면
if (user!== undefined) {
console.log(user.login.user.email)
이렇게 undefined 에러(TypeError)가 발생할 수 있는 위치를 생각하면서 단계 단계 조건물을 두었을 것이다. 😓
하지만 ?.
을 사용한다면 한줄에 해결이 가능했다.
user?.login?.user?.email
Author And Source
이 문제에 관하여([JavaScript] ?. 연산자 - Optional Chaining), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@wjd489898/JavaScript-.-연산자-Optional-Chaining저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)