암묵적 타입 변환 (Implicit Type Casting)
암묵적 타입 변환(타일 강제 변환) - 자바스크립트 엔진이 표현식을 평가할 때 코드의 문맥을 보고 암묵적으로 타입을 강제 변환시켜준다.
문자열 타입
문자열에서 +는 문자열 연결 연산자로 이용된다. 문자열 연결 시 피연산자 중 문자열 타입이 아닌 경우 문자열로 바꿔서 연결시켜준다.
연산자: 연산을 수행하는 기호(+, -, *, / ...)
피연산자: 연산에 참여하는 상수나 변수
연산자의 종류
//숫자 타입
0 + '1' // '01'
-0 + '' // '0'
NaN + '' // "NaN"
nan + '' // nan is not defined
// 불리언 타입
true + '' // 'true'
false + '' // 'false'
// 심볼 타입
(Symbol()) + '' // TypeError
({}) + '' // "[object Object]"
[10,20] + '' // "10,20"숫자 타입
산술 연산자( +, -, *, /, % )의 역할은 숫자를 만드는 것이다. 자바스크립트 엔진은 산술 연산을 하기 위해 숫자 타입이 아닌 피연산자를 숫자 타입으로 변환한다. 변환할 수 없는 경우 NaN이 나온다. NaN(Not a Number)은 연산 과정에서 잘못된 입력을 받았다는 것을 나타내는 기호이다.
// 문자열 타입
+'' // 0
+'0' // 0
// ( 1+'0'일 경우 '10'의 문자열이 된다. 숫자 타입보다 문자열 타입 변환이 우선한다는 걸 알 수 있다 )
+'string' // NaN
// 불리언 타입
+true // 1
+false // 0
// null 타입
+null // 0
// 객체 타입
+undefined // NaN
+{} // NaN
{a:1}['a'] // 1
+[] // 0
+[1] // 1
+[10,20] // NaN비교 연산자(>, < ...)의 역할은 왼쪽과 오른 쪽의 크기를 비교하는 용도이다. 마찬가지로 숫자 타입이 아닌 피연산자를 숫자 타입으로 변환한다.
'1' > 0 // true불리언 타입
if문이나 for문과 같은 제어문 또는 삼항연산자의 조건식은 참/거짓으로 평가되어야 하는 표현식이다. 그래서 자바스크립트 엔진이 조건식의 평가 결과를 불리언 타입으로 바꿔버린다. 이 때 불리언 타입(true/false)이 아니면 자바스크립트 엔진은 이게 참으로 평가되는 값인지(Truthy), 거짓으로 평가되는 값인지 한번 더 체크한다(Falsy).
false로 평가되는 Falsy값 (암기하자)
- false
- undefined
- null
- 0, -0
- NaN
- '' (빈문자열)
외에는 모두 true로 평가되는 Truthy 값이다.
if('') console.log('1'); // undefined
if(true) console.log('2');
if(0) console.log('3'); //
if(1) consoloe.log('4'); // 1은 true로 평가
if('str') console.log('5'); // 'str' true로 평가
if(null) console.log('6'); // undefined
// 2, 4, 52, 4, 5가 console.log에 찍히는 걸로 보아 숫자든 문자든 어떤 값이 있으면 Truhy 즉, true라고 볼 수 있다.
명시적 타입 변환(Explicit Type Conversion)
개발자의 의도에 따라 명시적으로 타입 변환하는 방법에는 표준 빌트인 생성자함수(String, Number, Boolean)를 사용하는 방법과 빌트인 메서드를 사용하는 방법이 있다.
표준 빌트인이란 말은.. 자바스크립트에서 기본으로 제공하고 있단 말이다. 생성자 함수와 메서드를 기본으로 제공하고 있다.
문자열 타입
String 생성자 함수를 new 연산자 없이 호출
Object.prototype.toString 메서드를 사용하는 방법
// 1. String 생성자 함수를 new 연산자 없이 호출
String(1) // '1'
String(true) // 'true'
String(NaN) // 'NaN'
// 2. Object.prototype.toString 메서드를 사용
(1).toString(); // '1'
(NaN).toString(); // 'NaN'
(true).toString(); // 'true'
// 암묵적 타입 변환 활용 : 문자열 연결 연산자
// 숫자 타입 -> 문자열
1 + '' // '1'
true + '' // 'true'숫자 타입
Number 생성자 함수를 new 연산자 없이 호출하는 방법
parseInt, parseFloat 함수 사용 (문자열만 숫자타입으로 변환가능)
// 1. Number 생성자 함수 사용
Number('0') // 0
Number(true) // 1
Number(false) // 0
// 2. parseInt, parseFloat 함수 사용
parseInt('0') // 0
parseFloat('10.53') // 10.53
// 암묵적 타입 변환 활용 : +단항 산술 연산자 사용
+'0' // 0
+true // 1
+false // 0
// 암묵적 타입 변환 활용 : *산술 연산자 사용
'0' * 1; // 0
true * 1 // 1
false * 1 // 0불리언 타입
boolean 생성자 함수를 new 연산자 없이 호출
! 부정 논리 연산자를 두번 사용하는 방법
// 1. Boolean 생성자 함수
// falsy를 넣으면 false값 나온다.
Boolean('x') // true
Boolean('') //false
Boolean('false') // true
Boolean(0) // false
Boolean(1) // true
Boolean({}) // true
Boolean([]) // true
// 2. ! 부정 논리 연산자를 두 번 사용하는 방법
!!'x'; // true
!!'' // false
!!'false' // true
!!0; // false
!!1; // true
!!{} // true
!![] // true