본문 바로가기
D.evelop/JavaScript

[JS] 널 병합연산자 Nullish Coalescing Operator

by Danne 2024. 10. 27.

??  : 널 병합연산자 (Nullish Coalescing Operator)

  • JavaScript에서 제공되는 독특한 연산자
  • 왼쪽 피연산자가 null 또는 undefined일 때만 오른쪽 값을 반환하는 문법
  • || 논리합 연산자(OR연산자) 와 비슷해 보이지만,
    ||는 0, 문자열 ("") , false 같은 "falsy" 값도 오른쪽 값으로 대체하는 반면
    ??는 null undefined만 처리

➡️ 기본값 설정이 필요한 경우 많이 사용. 
값이 0, 빈 문자열(""), false 등의 falsy 값일 때도 그대로 사용하는 것이 중요한 상황에서 사용.

router.push(path ?? '/login');

/*
path ?? '/login'는 
path가 null이거나 undefined인 경우에만 '/login'을 반환하고, 
path에 값이 있으면 그 값을 그대로 사용한다는 의미.
*/



예)
1. 기본값 설정

const itemsPerPage = userSettings.itemsPerPage ?? 10;

 

2. 함수 매개변수 기본값

/* ?? 연산자 */
function greet(user) {
  const name = user.name ?? "Guest";
  console.log(`Hello, ${name}!`);
}

greet({ name: null });    // "Hello, Guest!"  
greet({ name: "Alice" });  // "Hello, Alice!" 
greet({ name: 0 });        // "Hello, 0!" 


/*=============================================================*/

/* || 연산자 */
function bye(user) {
  const name = user.name || "Guest";
  console.log(`Goodbye, ${name}!`);
}

bye({ name: null });       // "Goodbye, Guest!"
bye({ name: "Tom" });      // "Goodbye, Tom!"  
bye({ name: 0 });          // "Goodbye, Guest!"

 

3. 옵션 객체 초기화

const options = {
  theme: userTheme ?? "light",
  language: userLanguage ?? "en",
};

 

 

 

반응형

댓글