형 변환이란?
형 변환은 “형태를 변환한다”는 의미로, 어떤 값의 타입을 다른 타입으로 변경하는 것을 뜻합니다. 영어로는 “Type Casting”이라고 합니다. 예를 들어, 숫자 타입(Number)인 값 10을 문자열 타입(String)인 "10"으로 변환하는 행위를 형 변환이라고 합니다.
자바스크립트에서의 형 변환은 "묵시적 형 변환"과 "명시적 형 변환"이라는 두 가지 방식으로 나뉩니다.
- 묵시적 형 변환 : 암묵적 형 변환이라고도 하며, 개발자가 명시적으로 지정하지 않아도 자바스크립트 엔진이 자동으로 값의 타입을 변경하는 것을 의미합니다.
- 명시적 형 변환 : 개발자가 특정 값의 타입을 명확히 정의하여 변환을 수행하는 것을 말합니다.
1. 묵시적 형 변환
묵시적 형 변환은 자바스크립트 엔진이 알아서 형 변환 하는 것을 말합니다.
let num = 10;
let str = "20";
const result = num + str;
console.log(result); // 1020위의 코드는 왜 1020이 출력되었을까요? 변수 num에 저장된 숫자 10이 묵시적으로 String 타입으로 변환되었기 때문입니다. 결과적으로, 변수 result에는 문자열 "10"과 문자열 "20"이 더해진 결과가 저장된 것입니다.
이처럼 숫자와 문자열을 더하는 불가능한 연산을 작성하면, 자바스크립트 엔진은 오류를 발생시키지 않기 위해 숫자를 문자열로 묵시적 형 변환을 수행합니다.
그러나 모든 불가능한 연산에서 묵시적 형 변환이 항상 발생하는 것은 아닙니다. 특정 변수만 형 변환했을 때 연산이 오류 없이 정상적으로 종료될 수 있는 경우에만, 자바스크립트 엔진은 묵시적 형 변환을 수행합니다.
2. 명시적 형 변환
명시적 형 변환은 개발자들이 내장 함수 등을 이용해서 직접 형 변환을 명시하는 방법입니다.
2.1 문자열 -> 숫자
문자열을 숫자로 형 변환하기 위해서는 Number()라는 내장 함수를 사용할 수 있습니다.
let str1 = "10";
let strToNum1 = Number(str1);
console.log(10 + strToNum1); // 20만약 문자열에 숫자 이외의 값이 포함되어 있는 경우, 위와 같은 방식으로는 형 변환이 이루어지지 않습니다.
let str2 = "10개";
let strToNum2 = Number(str2);
console.log(strToNum2); // NaN이럴 때는 parseInt()라는 내장 함수를 사용할 수 있습니다. parseInt() 함수는 숫자가 아닌 값이 포함된 문자열에서 숫자 부분만을 추출하여 숫자로 변환해줍니다.
let str2 = "10개";
let strToNum2 = parseInt(str2);
console.log(strToNum2); // 10이 때 주의할 점은 문자가 앞에 있게 되면 형 변환이 제대로 이루어지지 않습니다.
let str2 = "abc10개";
let strToNum2 = parseInt(str2);
console.log(strToNum2); // NaN2.2 숫자 -> 문자열
숫자를 문자열로 형 변환하기 위해서는 String()이라는 내장 함수를 사용할 수 있습니다.
let num1 = 20;
let numToStr1 = String(num1);
console.log(numToStr1 + "입니다."); // 20입니다.참고한 사이트
