JavaScript

[JavaScript] Optional chaining(?.) & Nullish coalescing(??)

prometedor 2024. 7. 10. 10:31

Optioinal chaining (?.)

객체의 속성을 안전하게 접근할 수 있게 해주는 연산자이다.

event.data가 null 또는 undefined인 경우에도 코드가 중단되지 않고 계속 실행한다.

예를들어, 'event' 객체가 아래와 같이 정의되어 있을 때

let event = {
    data: {
        startTime: "10:00 AM",
        location: "Conference Room"
    }
};

여기서 event.data.startTime은 "10:00 AM"을 반환한다.

하지만, event.data가 null이거나 undefined인 경우에는 event.data.startTime을 접근할 때 TypeError가 발생할 수 있다.

이 때 Optional chaining(?.)을 사용하면 이를 방지할 수 있다.

 

Nullish coalescing (??)

왼쪽 피연산자가 null 또는 undefined 일 때만 오른쪽 피연산자를 반환한다.

즉, 왼쪽 피연산자가 null 또는 undefined 가 아닌 경우 왼쪽 피연산자 자체를 반환한다.

예를들어, event.data.startTime이 null 또는 undefined일 경우 아래와 같이 "Unknown"을 반환한다.

event.data?.startTime ?? "Unknown"

event.data가 존재하고 event.data.startTime이 존재하면 그 값을 반환한다.

-> "10:00 AM" 을 반환

event.data가 null 또는 undefined이거나 event.data.startTime이 null 또는 undefined일 경우 "Unknown"을 반환한다.

 

 

 

이 코드는 객체의 중첩된 속성을 안전하게 접근하고 기본값을 설정하는 데 유용하다.