6장 타입 변환

타입 변환

• 개발자가 의도적으로 값의 타입을 변환시키는 것
• 암묵적 타입 변환 또는 타입 강제 변환
  • 의도 없이 표현식을 평가하는 도중 JS엔진에 의해 암묵적으로 타입이 자동변환 되는 것
  • 기존의 원시 값을 직접 변경하는 것이 아닌 새로운 원시 값을 생성하여 단 한 번 사용하고 버린다.

암묵적 타입 변환

문자열 타입으로 변환

• + 연산자는 피 연산자 중 하나 이상이 문자열 이면 문자열 연결 연산자로 동작
• 템플릿 리터럴의 표현식 삽입또한 평가 결과를 문자열 타입으로 암묵적 타입 변환

숫자 타입으로 변환

• -, *, /와 같은 산술 연산자는 피 연산자 중, 숫자 타입이 아닌 피연산자를 숫자타입으로 암묵적 타입 변환
• 숫자 타입으로 변환할 수 없는 경우 : 산술 연산 수행이 불가능하여 표현식의 평가 결과가 NaN
• 비교 연산자 : 값을 비교하여 불리언 값을 만들기 때문에 피 연산자를 숫자 타입으로 암묵적 타입 변환

불리언 타입으로 변환

• JS엔진은 불리언 타입이 아닌 값을 Truthy 값(참으로 평가되는 값) 또는 Falsy 값(거짓으로 평가되는 값)으로 구분
• Truthy는 true로, Falsy는 false로 암묵적 타입 변환
• 대표적 Falsy 값
  • false
  • undefined
  • null
  • 0, -0
  • NaN
  • ''(빈 문자열)

명시적 타입 변환

문자열 타입으로 변환 ( String, toString() )

• new 연산자 없이 String 생성자 사용(ex: String(1);)
• Object.prototype.toString(ex: (1).toString();)
• 문자열 연결 연산자를 이용하는 방법(ex: 1 + '';)

숫자 타입으로 변환 ( Number, parseInt(), parseFloat() )

• new 연산자 없이 Number 생성자 함수 사용(ex: Number('0');)
• parseInt, parsefloat 함수 사용 --> 문자열만 숫자 타입으로 변환 가능(ex: parseInt('0');)
• + 단항 산술 연산자 이용(ex: +'0';)
• * 산술 연산자 이용(ex: true * 1;)

// 피연산자가 모두 문자열 타입이어야 하는 문맥
'10' + 2 // -> '102'

// 피연산자가 모두 숫자 타입이어야 하는 문맥
5 * '10' // -> 50

// 피연산자 또는 표현식이 불리언 타입이어야 하는 문맥
!0 // -> true
if (1) { }

불리언 타입으로 변환

• new 연산자 없이 Boolean 생성자 함수 사용(ex: Boolean('x');)
• ! 부정 논리 연산자를 두 번 사용(ex: !!'x';)

// 숫자 타입
0 + ''         // -> "0"
-0 + ''        // -> "0"
1 + ''         // -> "1"
-1 + ''        // -> "-1"
NaN + ''       // -> "NaN"
Infinity + ''  // -> "Infinity"
-Infinity + '' // -> "-Infinity"

// 불리언 타입
true + ''  // -> "true"
false + '' // -> "false"

// null 타입
null + '' // -> "null"

// undefined 타입
undefined + '' // -> "undefined"

// 심벌 타입
(Symbol()) + '' // -> TypeError: Cannot convert a Symbol value to a string

// 객체 타입
({}) + ''           // -> "[object Object]"
Math + ''           // -> "[object Math]"
[] + ''             // -> ""
[10, 20] + ''       // -> "10,20"
(function(){}) + '' // -> "function(){}"
Array + ''          // -> "function Array() { [native code] }"

단축 평가

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

단축 평가 표현식	평가 결과
true || anything	true
false || anything	anything
true && anything	anything
false && anything	false

• 단축평가가 유용하게 사용되는 상황
  1. 객체가 가리키기를 기대하는 변수가 null 또는 undefined가 아닌지 확인하고 프로퍼티를 참조할 때 (var value = elem && elem.value)
  2. 함수 매개변수에 기본 값을 설정할 때(기본값을 설정해두면 undefined로 발생할 수 있는 에러 방지가능)

옵셔널 체이닝

• ?.로 사용하며 좌항의 피연산자가 null 또는 undefined인 경우 undefined를 반환하고, 그렇지 않으면 우항의 프로퍼티 참조를 함.

null 병합 연산자

• ??로 사용하며 좌항의 피연산자가 null 또는 undefined인 경우 우항의 피연산자를 반환하고, 그렇지 않으면 좌항의 피연산자를 반환한다.