값이 개발자의 의도에 따라서 변환되는 것은 명시적 타입 변환 또는 타입 캐스팅이라 한다.
그리고 개발자의 의도와 관계없이 JS 엔진에 의하여 변하는 것을 암묵적 타입 변환 또는 타입 강제 변환이라 한다.
이전에 예시 들었던 if 문에서 boolean 타입이 반환되는 걸 생각하면 된다.
하지만, 이 값이 실제로 변경되는 것은 아니다. 일반적으로 원시 값은 변경 불가능한 값이므로 변경할 수 없다. 기존 원시 값을 이용하여 새로운 원시값을 생성하는 것이다.
명시적 변환은 결과를 예측하기 쉬워서 에러를 줄일 수 있으나 가독성 측면에서 암묵적 변환에게 밀리는 경우가 있어서 두 개가 혼합하여 사용하게 된다.
10 + '' // 암묵적
(10).toString() + '' //명시적
boolean값으로 암묵적 타입 변환이 일어날 때 ture로 변환 되는 값은 Truthy, false로 변환되는 값을 Falsy라 한다.
대표적인 Falsy값은 false / undefined / null /0 /-0. NaN, ''(빈 문자열)이 있다.
※ []와 {}은 Truthy한 값이다. 블로그 주인은 이걸로 코테에서 당황했었다.
명시적 타입 변환
명시적 타입 변환의 경우 다양한 방법이 있다. 이를 알아보자.
문자열
1. String 생성자 함수 사용하기 ex). String(10)
2. Object.proptotype.toString 메서드 사용하기. ex). (10).toString()
3. 문자열 연결 연산자 사용하기 ex). 1 + '' // '1'
숫자
1. Numer 생성자 함수 사용하기 ex). Number('10')
2. parseInt, parseFloat 함수 사용하기. ex). parseInt('0')
3. + 단항 산술 연사자, *산술 연산자 사용 ex). +true, true*1 //1
불리언
1. Boolean 생성자 함수 사용 ex). Boolean('x')
2. ! 부정 논리 연산자 두 번사용 ex). !!0
단축 평가
논리합과 논리곱은 좌항에서 우항으로 암묵적 타입변환을 통해 값을 평가 후, 마지막에 평가된 피연산자를 그대로 반환한다. 이처럼 표현식 평가 도중 평가 결과가 합정되어서 나머지 과정을 생략하는 것을 단축 평가라 부른다.
'cat' && 'dog' // 'dog'
'cat' || 'dog' // 'cat'
다양하게 사용가능하지만 주로, 객체가 null 또는 undefined인지 확인하고 프로퍼티를 참조하기 위해서 함수 매개변수에 기본값을 설정할 때(ES6에서는 이 기능을 제공하여서 안 쓰기도 한다.) 사용한다.
옵셔널 체이닝 연산자
?. 연산자는 좌항의 피연산자가 null 또는 undefined면 undefined를 반환하고 그렇지 않으면 우항으로 프로퍼티 참조를 이어간다.
&&은 0이나 '' 인 경우 해당 값을 반환하지만, ?.은 null or undefined가 아니면 계속 이어지기에 null/undefined 체크에서 더욱 편리할 때가 있다.
null 병합 연산자
??로 좌항의 값이 null 또는 undefined면 우항을 반환하고, 아니라면 좌항을 반환한다.
'책과 강연 > 모던 자바스크립트 DeepDive' 카테고리의 다른 글
모던 자바스크립트 Deep Dive 11장 : 원시 값과 객체의 비교 (0) | 2023.04.08 |
---|---|
모던 자바스크립트 Deep Dive 10장 : 객체 리터럴 (0) | 2023.04.08 |
모던 자바스크립트 Deep Dive 8장 : 제어문 (0) | 2023.04.07 |
모던 자바스크립트 Deep Dive 7장 : 연산자 (0) | 2023.04.06 |
모던 자바스크립트 Deep Dive 6장 : 데이터 타입 (1) | 2023.04.03 |