단축 평가란 표현식을 평가하는 도중 평가 결과가 확정된 경우에 나머지 평가 과정을 생략하는 것을 말한다.
✔ 논리곱(&&)
연산자는 두 개의 피연산자가 모두 true일 때 true를 반환한다.
✔ 논리합(||)
연산자는 두 개의 피연산자 중 하나만 true여도 true를 반환한다.
// 논리곱(&&) 연산자
'blue' && 'green' // green
false && 'green' // false
'blue' && false // false
// 논리합(||) 연산자
'blue' || 'green' // blue
false || 'green' // green
'blue' || false // blue
옵셔널 체이닝 연산자 ?.
는 좌항의 피연산자가 null이나 undefined일 경우 undefined를 반환하고 아니라면 우항의 프로퍼티 참조를 이어간다.
// optional chaining
var element = null;
var value = element?.value;
console.log(value);
[실행결과]
undefined
좌항 피연산자가 false로 평가되는 값이라도 null이나 undefined가 아니면 우항의 프로퍼티 참조를 이어간다.
// optional chaining
var str = '';
var length = str?.length;
console.log(length);
[실행결과]
0
null 병합 연산자 ??
는 좌항의 피연산자가 null이나 undefined인 경우 우항의 피연산자를 반환하고 아니면 좌항의 피연산자를 반환한다. 변수에 기본값을 설정할 때 유용한 연산자이다.
// nullish coalescing
var nullcoa = null ?? "right";
console.log(nullcoa);
[실행결과]
right
null 병합 연산자가 도입되기 전에는 논리합 연산자를 사용했다. 논리합의 경우 좌항의 피연산자가 Falsy 값일 때 우항의 피연산자를 반환하는데, Falsy 값이 0이나 ''가 기본값으로 유효하다면 예기치 않은 동작이 발생한다는 단점이 존재했다.
// OR operator
var orOpr = '' || "right";
console.log(orOpr);
// nullish coalescing
var nullcoa = '' ?? "right";
console.log(nullcoa);
[실행결과]
right
''
그러나 null 병합 연산자를 사용하면 좌항의 피연산자가 false로 평가되더라도 null이나 undefined가 아닐 때 좌항의 피연산자를 그대로 반환한다.