[TIL] JavaScript 공부 : 단축 평가

모던 자바스크립트 Deep Dive : 이웅모

논리 연산자를 사용한 단축 평가

js를 공부하다가 매우 신기한 것을 발견하였다. 파이썬에서도 있는 기능인 것 같은데, 아래의 예를 보자.

1
2
'Cat' && 'Dog'; // -> "Dog"
'Cat' || 'Dog'; // -> "Cat"

왜 이러한 결과가 나올까?
결과부터 말하자면, 논리 연산의 결과를 결정하는 피연산자를 타입 변환하지 않고 그대로 반환한다. => 이를 단축평가라 한다.
단축 평가는 표현식을 평가하는 도중에 평가 결과가 확정된 겨우 나머지 평가 과정을 생략하는 것을 말한다.

  • && 연산자는 두 개의 피연산자가 모두 true로 평가될 때 true를 반환한다. ‘Cat’만으로는 &&의 결과를 판단할 수 없어 ‘Dog’까지 보고 ‘Dog’를 반환한다.
  • || 연산에서는 ‘Cat’만으로도 true라는 값을 평가할 수 있기에 ‘Cat’을 반환한다.

함수 매개변수에 기본값을 설정할 때

함수를 호출할 때 인수를 전달하지 않으면 매개변수에는 undefined가 할당된다. 이때 단축 평가를 사용해 에러를 방지해보자.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function getStringLength(str) {
    str = str || '';
    return str.length;
}

getStringLength(); // 0
getStringLength('hi'); // 2

// ES6의 매개변수의 기본값 설정
function getStringLength(str = '') {
    return str.length;
}

getStringLength(); // 0
getStringLength('hi'); // 2