[mjt] nullish 병합 연산자 ‘??’는 언제 사용할까?
nullish 병합 연산자 ‘??’는 언제 사용할까?
자바스크립트에서 조건을 처리할 때, 변수의 값이 null또는 undefined인지 확인하고 기본값을 설정하는 로직은 자주 사용된다. 이때 등장한 nullish 병합 연산자(??)는 이러한 작업을 간결하고 명확하게 처리하도록 도와준다.
nullish 병합 연산자란?
??는 null 또는 undefined를 확인하고, 값이 없을 때 기본값을 반환하는 연산자다. 즉, 값이 null이거나 undefined일 경우에만 오른쪽 값을 반환한다. 아래의 기본 문법을 보자.
let result = a ?? b;
-
a가null또는undefined일 경우b를 반환함 -
a가 그 외의 값일 경우a를 반환함
그럼 언제 사용될까?
2-1) 기본값 설정
변수의 값이 없을 경우 기본값을 설정할 때 유용하다.
const userName = null;
const defaultName = "Guest";
const nameToDisplay = userName ?? defaultName;
console.log(nameToDisplay); // "Guest"
2-2) 함수 매개변수의 기본값 처리
함수 호출 시, 인자가 없거나 undefined일 경우 기본값을 설정한다.
function greet(name) {
const greetingName = name ?? "Anonymous";
console.log(`Hello, ${greetingName}!`);
}
greet(); // "Hello, Anonymous!"
greet("Rarrit"); // "Hello, Rarrit!"
2-3) 데이터 읽을때 값 확인
데이터 객체에서 값이 없는 경우 기본값을 설정할 때 활용한다.
const userSettings = {
theme: null,
};
const theme = userSettings.theme ?? "black";
console.log(theme); // "black"
중첩 ?? 연산자
?? 연산자는 중첩해서 사용할 수 있다.
const value = null ?? undefined ?? "default" ?? "anther Default";
console.log(value);
("default");
회고
- nullish 병합 연산자 (??)는 자바스크립트에서 기본값 설정을 보다 안전하고 명확하게 처리할 수 있는 방법이다.
-
특히, Falsy 값(0, 빈 문자열, false 등)을 유효한 값으로 취급해야 하는 경우 대신 ??를 사용하는 것이 더 적합하다.
const value1 = 0 ?? 42; // 0
const value2 = null ?? 42; // 42