객체 속성 안전 접근! 옵셔널 체이닝/nullish 연산자

옵셔널 체이닝(?.) 과 널 병합 연산자(??)

옵셔널 체이닝과 널 병합 연산자(nullish)는 객체의 속성을 접근할 때 안전하게 접근하기 위해 사용된다

 

아래와 같은 객체가 있다면

const user = {
  name: 'John',
  address: {
    city: 'New York',
    zipcode: '10001'
  }
};

 

1. 옵셔널 체이닝(?.)

객체의 속성이 undefined/null 이라면 undefined 를 반환하고, 속성이 있다면 해당 속성에 접근한다

const city = user.address?.city;
console.log(city); // New York

const contry = user.address?.contry;
console.log(contry); // undefined

 

함수 호출에도 적용할 수 있어, 객체가 메소드를 가지고 있지 않은 경우에도 안전하게 호출할 수 있다

const result = user.getDetails?.();  // user.getDetails가 존재하지 않으면 undefined 반환

 

체이닝이 가능한데, 만약 처음 undefined가 발견되면, 바로 undefined를 반환하고 종료된다

console.log(user.profile?.details?.age);

2. 널 병합 연산자(??)

널 병합 연산자는 주로 기본값을 설정할 때 사용된다

특정 속성이 undefined/null이라면 기본값을 사용하고,  속성이있다면 해당 속성에 접근한다

const zipcode = user.address?.zipcode??"없어요";
console.log(zipcode); //10001

const country = user.address?.country??"없어요";
console.log(country); //없어요

 

 

결론

옵셔널 체이닝과 널 병합 연산자는 객체의 속성을 안전하게 접근하기 위한 목적으로 사용된다

 

옵셔널 체이닝

객체 속성 없으면 undefined!

 

널 병합 연산자(nullish)

객체 속성 없으면 기본값!