자바스크립트를 사용하여 데이터 타입을 숫자로 변경하는 방법에 대하여 알아볼까 합니다. 우선 자바스크립트에서 사용되는 데이터 타입에는 문자, 숫자, 불리언, Null 등 여러가지가 있습니다. 이런 형태 중 숫자타입으로 변경할 때 사용하는 함수는 아래와 같습니다.



# 자바스크립트 숫자 타입으로 변경하기, parseInt()
숫자타입으로 변경하는 방법으로 자바스크립트의 내장함수인 parseInt()를 사용할 수 있습니다. 이 함수는 해당하는 값을 숫자 타입으로 바꾸어 변경해줍니다. 문법은 아래와 같죠.

parseInt(숫자타입으로 변경할 문자열, 진법)


여기서 첫번째 문자열은 필수이고 진법은 없으면 10진법으로 사용됩니다. 만약 16진법인 경우라면 parseInt('123', 16)처럼 사용할 수 있죠.

그렇다면 위 함수를 사용한 간단한 예제를 함께 알아보겠습니다.


! parseInt() 함수 예제보기
아래는 parseInt()를 사용하여 각각의 타입값에 대하여 예제를 수행해보았습니다. 어떤 경우에 어떤 값으로 나오는지 알아보세요.


! 문자값 123을 변환하기 문자 '123'을 숫자타입으로 변경해보겠습니다.
str_value = '123';
typeof(str_value);
// 현재의 타입이 string 문자타입임을 확인

int_value = parseInt(str_value);
// 함수를 사용하여 숫자 자료형으로 변경함
typeof(int_value);
// 타입 확인결과 문자에서 숫자 타입으로 변경되었음

위의 스크립트를 실행하면 아래와 같이 출력됩니다.
console.log(int_value)

// 123이 출력됨

출력된 값은 문자타입이 아닌 숫자타입으로 변경된 123이 출력되게됩니다. 위에서 함수 parseInt()를 사용하여 문자가 숫자로 변경되었습니다. 이처럼 문자 타입이라도 숫자의 값이 저장된 경우 이를 숫자로 변환하여 반환합니다.


! 숫자와 문자가 포함된 경우
만약 문자타입안에 숫자와 문자가 함께있는 경우 어떻게 출력될까요? 이 경우 숫자가 앞에 포함된 경우에는 숫자만 남기고 나머지 문자는 무시합니다. 아래 예제를 봐주세요.
str_value = '123test';
typeof(str_value);
// 영문이 포함된 문자타입임

int_value = parseInt(str_value);
// 함수를 사용하여 숫자 자료형으로 변경함
typeof(int_value);
// 타입이 숫자로 변경되며 뒤에 포함된 문자가 삭제됨

이제 위 스크립트를 실행하면 아래와 같이 출력됩니다.
console.log(int_value)

// 123이 출력됨 

* 앞에 문자가 포함된 경우의 예제
만약 앞에 포함된 경우 어떻게 출력될까요?
console.log('test123')

// NaN이 출력됨

이 경우에는 NaN 즉 숫자가 아닌 타입인 NaN(Not a Number)이 반환됩니다.


# parseInt() 몇가지 예제 더 보기이제 몇 가지 예제를 더 알아보겠습니다. 아래의 경우 어떻게 출력되는지 알아보세요.
parseInt('123+');
parseInt('0.123');
parseInt('-123')
parseInt('123-')
parseInt(undefined)
parseInt(null)

각각의 출력결과는 아래와 같습니다.
123
0
-123
123
NaN
NaN

여기까지 parseInt() 함수의 사용방법 및 다양한 예제를 함께 알아보았습니다.


! 참고숫자로 변환하는 다른 방법도 있습니다. 문자에 1을 곱하는 방법인데요 ~ 예를들어 아래의 문자에 1을 곱하면 숫자로 변환되어 나타납니다.
'0.777' * 1

// 타입이 숫자인 0.777로 변환됨

코드가 간결하여 자주 사용되니 참고하세요.