[JavaScript] nullish 병합 연산자 ??

nullish 병합연산자 ??

최근에 추가됨.
스펙에 추가된지 얼마안된 문법. 구식 브라우저는 폴리필이 필요하다.

nullsh 병합연산자(nullish coalescing operator) ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 확정되어 있는 변수를 찾을 수 있다.

a ?? b 의 평가 결과는 다음과 같다.

• a가 null도 아니고 undefined도 아니면 a
• 그 외의 경우 b

nullish 병합 연산자 ??없이 x = a ?? b와 동일한 동작을 하는 코드를 작성하면 다음과 같다.

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

??와 ||의 차이

• ||는 첫 번째 truthy값을 반환.
• ??는 첫 번째 정의된(defined) 값을 반환.
• null과 undefined, 숫자 0을 구분지어 다뤄야 할 때 매우 중요.

// height에 값이 정의되지 않은 경우 height엔 100이 할당.
height = hegiht ?? 100;

let height = 0;
alert(height || 100);
alert(height ?? 100);

height || 100은 height에 0을 falsy(0 = false)한 값으로 취급, null이나 undefined를 할당한 값으로 취급. 100의 결과를 낳는다. 반면, height ?? 100의 평가결과는 height가 정확하게 null이나 undefined일 경우에만 100이 된다. 0의 결과값이 나온다.

??는 변수에 기본값ㅇ르 할당하는 용도로 사용할 수 있다.

// height가 null이나 undefined인 경우, 100을 할당.
height = height ?? 100;

연산자 우선순위

• ??의 연산자 우선순위는 대다수의 연산자보다 낮고 ?와 =보다는 높다.
• 괄호없이 ??를 ||나 &&와 함께 사용하는 것은 금지되어 있다.

 

Reference

nullish 병합 연산자 '??'