TIL_20210320

null 병합 연산자 "??"

• 여러 피연산자 중 그 값이 '확정되어있는' 변수를 찾을 때 사용
• a ?? b의 평가 결과
  • a가 null도 아니고 undefined도 아니면 a
  • 그 외의 경우에는 b

x = a ?? b;
  = (a !== null && a !== undefined) ? a : b;

• 예시: firstName, lastName, nickName이란 변수에 사용자 이름이나 별명을 저장하는데, 사용자가 아무것도 아무런 정보도 입력하지 않는 케이스엔 "Anonymous"를 출력.

let firstName = null;
let lastName = null;
let nickName = null;
console.log(firstName ?? lastName ?? nickName ?? "Anonymous"); // Anonymous

• 연산자 우선순위 및 안정성 관련 이슈로 사용시 괄호"()"를 추가하여 사용
• 괄호"()" ??를 ||나 &&와 함께 사용하는 것은 금지

let x = 1 && 2 ?? 3; // SyntaxError: Unexpected Token '??'
let x = (1 && 2) ?? 3; // it works!
console.log(x); // 2

"||"와 "??"의 차이

• ||는 첫 번째 truthy 값을 반환
• ??는 첫 번째 정의된(defined) 값을 반환
• 예시: null과 undefined, 숫자 0을 구분 지어 다뤄야 할 때 차이점 발생

let height = 0;
console.log(height || 100); // 100
// height에 0을 할당했지만, 0을 falsy한 값으로 취급
console.log(height ?? 100); // 0
// height가 정확하게 null이나 undefined일 경우에 100 출력

• 높이처럼 0이 할당될 수 있는 변수를 사용해 기능을 개발할 땐 ||보다 ??이 적합