Javascript 타입 변환

자바스크립트는 동적 언어이므로 타입 변환이 자유롭다. 이때 개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환 , 그리고 개발자의 의도와 상관없이 코드의 문맥을 고려해 암묵적으로 타입을 강제 변환하는 것을 암묵적 타입 변환 이라고 한다.

명시적 타입 변환, 암묵적 타입 변환

명시적 타입 변환

const x = 10;
const str = x.toString();
console.log(type of str, str); string 10

암묵적 타입 변환

'10' + 2 // 102
5 * "10" // 50
if (1) {} // 1이 불리언 타입으로 변경

불리언 타입으로의 변환(Truthy Falsy)

자바스크립트 엔진은 불리언 타입이 아닌 값을 Truthy 값(참으로 평가되는 값) 또는 Falsy 값(거짓으로 평가되는 값)으로 구분한다. 즉, 제어문의 조건식과 같이 불리언 값으로 평가되어야 할 문맥에서 Truthy값은 true, Falsy값은 false로 암묵적 타입 변환 이 된다.

false로 평가되는 Falsy값

1. false
2. undefined
3. null
4. 0, -0
5. NaN
6. ""

몰랐던 사실(Truthy Falsy) - array[]과 객체{}는 비어있어도 true...

단축 평가

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

true || anything // true
false || anything // anything
true && anything // anything
false && anything // true

옵셔널 체이닝 연산자

앞서 논리연산자 && 을 사용하여 단축평가를 내릴 수 있었다. 하지만 피연산자의 null값과 undefined 값만 알아낼 수는 없었다. 이를 해결하기 위해 나온 것이 바로 옵셔널 체이닝 연산자이다.

예) 논리 연산자를 사용할 때

var str = ""
var length = str && str.length;

console.log(length); // ""

예) 옵셔널 체이닝 연산자를 사용

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

null 병합 연산자

null 병합 연산자도 마찬가지로 옵셔널 체이닝 연산자와 유사하게 논리연산자 ||의 null 값과 undefined 값만을 알아내기 위한 것이라고 보면된다.

즉, 좌항의 피연산자가 null 또는 undefined일 경우 우항의 피연산자를 반환, 글엏지 않을 경우 좌항의 피연산자를 반환한다.

예) 논리연산자 ||를 사용했을 때

var foo = "" || 'default'
console.log(foo) // default

예) null 병합 연산자를 사용했을 때

var foo = "" ?? 'default'
console.log(foo) // ""

래퍼 객체(Wrapper Object)

▶ 원시타입의 메서드를 호출하면,
1) 순간적으로 원시타입에 해당하는 '객체'가 생성되고,
2) 이 '객체'의 메서드가 호출된다.
3) 메서드 처리가 끝나면 이 '객체'는 사라지고,
4) 원래의 원시타입만 남는다.

순간적으로 생성되었다 사라지는 객체를 래퍼 객체(Wrapper Object)라고 하는데,
자바스크립트 엔진이 암묵적으로 원시타입에 해당하는 래퍼 객체를 생성하고,
볼일이 끝나면 다시 원시타입으로 복귀시키는 것이다.

참고 자료 :

단축평가, 타입변환 : 모던 자바스크립트 deep dive 7~9장
래퍼 객체 : https://curryyou.tistory.com/184