타입 변환 및 단축 평가

명시적 타입 변환 (explicit coercion)

문자열 타입으로 변환

1. String 생성자 함수를 new 연산자 없이 호출

   String(1); // '1'
   String(NaN); // 'NaN'
   String(true); // 'true'

2. Object.prototype.toString 메서드 이용

   (1).toString(); // '1'
   (NaN).toString(); // 'NaN'
   (true).toString(); // 'true'

3. 문자열 연결 연산자를 이용 (암묵적 타입 변환)

   1 + ''; // '1'
   NaN + ''; // 'NaN'
   true + ''; // 'true'

숫자 타입으로 변환

1. Number 생성자 함수를 new 연산자 없이 호출

   Number('0'); // 0
   Number('11.23'); // 11.23
   Number(true); // 1

2. parseInt, parseFloat 함수 사용(문자열만 가능)

   parseInt('0'); // 0
   parseInt('11.23'); // 11
   parseFloat('11.23'); // 11.23

3. + 단항 산술 연산자 이용 (암묵적 타입 변환)

   +'0'; // 0
   +'11.23'; // 11.23
   +true; // 1

4. * 산술 연산자 이용 (암묵적 타입 변환)

   '0' * 1; // 0
   '11.23' * 1; // 11.23
   true * 1; // 1

불리언 타입으로 변환

1. Boolean 생성자 함수를 new 연산자 없이 호출

   Boolean('') // false
   Boolean('0') // true
   Boolean('false') // true

2. ! 부정 논리 연산자를 두 번 사용

   !!'' // false
   !!'0' // true
   !!'false' // true
   !!0 // false

단축 평가

표현식 평가 도중에 결과가 확정된 경우 나머지 평가 과정을 생략하는 것을 단축 평가(short-circuit evaluation)라고 합니다.

논리 연산자

논리 연산자 &&는 좌항이 false로 평가되는 Falsy 값(false, undefined, null, 0, -0, NaN, '')이면 좌항 피연산자를 타입 변환 없이 그대로 반환합니다.

논리 연산자 ||는 좌항이 false로 평가되는 Falsy 값(false, undefined, null, 0, -0, NaN, '')이면 우항 피연산자를 타입 변환 없이 그대로 반환합니다.

true || 'hello' // true
false || 'hello' // 'hello'
true && 'hello' // 'hello'
false && 'hello' // false

옵셔널 체이닝 연산자

ES11에서 도입된 옵셔널 체이닝(optional chaining) 연산자 ?.는 좌항이 null 또는 undefined인 경우에만 undefined를 반환합니다.

var str = null;

var strLength = str && str.length; // 옵셔널 체이닝 연산자 도입 이전 방식
console.log(strLength) // null

var strLength = str?.length;
console.log(strLength) // undefined

var str = '';
var strLength = str?.length;
console.log(strLength) // 0

null 병합 연산자

ES11에서 도입된 null 병합(nullish coalescing) 연산자 ??는 좌항이 null 또는 undefined인 경우에만 우항의 피연산자를 반환합니다. 그렇지 않은 경우에는 좌항의 피연산자를 반환합니다.

var defaultValue = null || 'default value'; // null 병합 연산자 도입 이전 방식
console.log(defaultValue); // 'default value'

var defaultValue = null ?? 'default value';
console.log(defaultValue); // 'default value'

var defaultValue = '' ?? 'default value';
console.log(defaultValue); // ''