[JS] Optional Chaining

Optional Chaining은 ?. 앞의 평가 대상이 null이나 undefined인 경우 평가를 멈추고 undefined를 반환

let user = null;

alert( user?.address ); // undefined
alert( user?.address.street ); // undefined

위와 같이 user 객체가 존재하지 않더라도 에러가 발생하지 않는다.

정리

1. ?. 을 사용하면 프로퍼티가 없는 객체에 에러 없이 안전하게 접근이 가능하다.

• user && user.address && user.address.street
• user?.address?.street

2. ?. : 해당 객체가 undefined 이나 null이면 평가를 멈추고 undefined를 반환한다.
3. 옵셔널체이닝은 존재하지 않아도 괜찮은 대상에만 사용하는 것이 바람직하다.
4. ?.은 연산자가 아닌 특별한 문법 구조체(Sysnatx construct) 이다.
5. delete와 조합하여 사용 가능하다.

• delete user?.name

6. 읽기나 삭제에는 사용가능하지만, 쓰기에는 사용 불가능하다.

• user?.name = "Violet"; // SyntaxError: Invalid left-hand side in assignment

7. 옵셔널 체이닝(?.) 사용방식 4가지

• obj?.prop : obj가 존재하면 prop 반환, 없으면 undefined 반환
• obj?.[prop] : obj가 존재하면 prop 반환, 없으면 undefined 반환
• obj?.method() : obj가 존재하면 method()호출, 아니면 undefined 반환
• obj.method?.() : obj의 메서드 method가 존재하면 메소드 실행, 아니면 undefined 반환