[ONEBITE-REACT] JS 기본 - 형 변환 (Type Casting)

의미

형 변환 (Type Casting) : 어떤 값의 타입을 다른 타입으로 변경하는 것을 말함

예를 들어 10이라는 Number Type을 "10"이라는 String Type으로 변경하는 것을 말함.

종류

묵시적 형 변환 (암묵적 형 변환)

개발자가 직접 설정하지 않아도 알아서 자바스크립트 엔진이 형 변환을 하는 것을 말한다.

명시적 형 변환

개발자가 직접 함수 등을 이용하여 형 변환을 하는 것을 말한다.

묵시적 형 변환 (암묵적 형 변환)

묵시적 형 변환이 일어나는 경우는 아래와 같다.

 

1. number type + string type

let num = 10;
let str = "20";

const result = num + str;
console.log(result);
console.log(typeof result);

변수 num은 number type이고 변수 str은 string type이지만 이 둘을 더해서 result라는 값으로 초기화하니,

30이 출력되는 것이 아니라 string + string처럼 1020으로 값이 출력되었고, 타입을 조회해보니 string으로 나온다.

명시적 형 변환

명시적으로 개발자가 형 변환을 하는 함수를 사용해서 data type을  string에서 number로, number에서 string으로 변환할 수 있다.

1. String to Number

let str = "10";
let strToNum1 = Number(str); // Number()를 사용하여 숫자만 들어있는 string type을 number type으로 형 변환 할 수 있다.

let str2 = "2개";
let strToNum2 = parseInt(str2); // 숫자 말고 다른 문자가 들어가있는 경우 Number로는 형 변환 되지 않고, parseInt()를 사용해야 한다.
// 단, "약 2개" 처럼 숫자 앞에 문자가 오면 안 되고 숫자로 먼저 시작하는 값에만 parseInt()를 사용할 수 있다.

2. Number to String

String() 함수를 사용하여 형 변환 가능하다.

let num = 20;
let numToStr = String(num);