ES11에서 새로 도입된 Nullish Coalescing 연산자는 null 또는 undefined 값을 확인하고 대체값을 제공하는데 유용합니다. 이것은 코드에서 조건문을 간결하게 작성할 수 있게 해주며, 특히 변수나 속성이 null 또는 undefined인지 확인하는 작업에 선호되는 방법입니다.

예제 1: 변수 초기화

Nullish Coalescing 연산자를 사용하여 변수를 초기화하는 예제를 살펴보겠습니다. 예를 들어, 사용자의 이름이 null 또는 undefined인 경우 “Unknown”으로 초기화하고 그렇지 않은 경우에는 원래 값으로 초기화하는 코드를 작성해 보겠습니다.

const userName = null;
const defaultName = 'Unknown';

const name = userName ?? defaultName;

console.log(name); // "Unknown"

위의 예제에서 userName 변수가 null이거나 undefined인 경우, Nullish Coalescing 연산자(??)는 defaultName 값을 반환합니다. 따라서 name 변수는 “Unknown”으로 초기화됩니다. 그러나 만약 userName 변수가 null 또는 undefined가 아닌 다른 값이라면, name 변수는 원래 값으로 초기화됩니다.

예제 2: 속성 접근

Nullish Coalescing 연산자를 사용하여 객체의 속성에 접근하는 예제를 살펴보겠습니다. 예를 들어, 사용자 객체가 존재하고 그 안에 name 속성이 있는지 확인하고 없는 경우 “Unknown”으로 설정하는 코드를 작성해 보겠습니다.

const user = {
  age: 25
};

const name = user.name ?? 'Unknown';

console.log(name); // "Unknown"

위의 예제에서 user 객체에는 name 속성이 없으므로 Nullish Coalescing 연산자(??)는 ‘Unknown’을 반환합니다. 따라서 name 변수는 “Unknown”으로 설정됩니다. 반대로, 만약 user 객체에 name 속성이 존재한다면, Nullish Coalescing 연산자는 해당 속성의 값을 반환하고 name 변수는 그 값으로 설정됩니다.

결론

ES11에서 도입된 Nullish Coalescing 연산자는 코드를 더 간결하게 작성할 수 있게 해주는 유용한 기능입니다. 변수 초기화 또는 속성 접근과 같은 작업에서 null 또는 undefined 값의 처리를 간편하게 할 수 있습니다. 이번 예제를 참고하여 실제 프로젝트에서 Nullish Coalescing 연산자를 적절히 활용해 보세요.

#JavaScript #NullishCoalescing