parseInt()에서 radix를 생략해도 될까?

묵은지·2020년 8월 2일

JavaScript에서 문자열을 숫자형으로 변환해주는 메소드는 parseInt(), Number() 두 가지가 있는데요. 이번 포스팅에서는 새롭게 알게 된 parseInt()의 기능에 대해 정리해 보겠습니다.

parseInt() 메소드

기본 문법

parseInt(string, radix[optional])

parseInt() 메소드는 string을 특정 진수로 변환해주는 메소드입니다. string을 radix로 변환한 정수(or NaN)를 리턴합니다.

string의 prefix에 따라 결정되는 radix

저는 보통 radix를 생략한 채 사용해 왔었는데요. 공식문서에는 Be careful—this does not default to 10!(기본 값이 10이 아니야 조심해!) 라고 안내되어 있습니다. radix는 언제나 10이 아닌 걸까요? 아래 예시를 보면서 확인해 봅시다.

console.log(parseInt('0x30')); // 1. return 48
console.log(parseInt('030')); // 2. return (ECMAScript5 이상)30
console.log(parseInt('30')); // 3. return 30

1번은 16진수로, 2번과 3번은 10진수로 변환되었습니다. radix는 string의 prefix에 따라 결정되기 때문인데요.
그 이유는 프로그래밍에서 16진수(prefix '0x')와 8진수(prefix '0')의 표기법과 관련이 있습니다. JavaScript에서는 radix를 생략할 경우 16진수나 8진수, 혹은 10진수로 값을 설정합니다. string이 0x로 시작할 경우에는 16진수, 0일 때는 8진수나 10진수, 이 외에는 10진수로 변환을 시도합니다.

예시 설명
1번 parseInt('0x30')은 16진수 표기법을 나타내고 있어, parseInt('0x30', 16)과 같은 의미입니다. 따라서 16진수 30을 숫자로 변환한 48이 리턴됩니다.(16진수 30 = 16*3 + 1*0 = 48)
2번 parseInt('030')은 8진수 표기법을 나타내 24가 리턴되어야 할 것 같지만 10진수 30이 리턴되었습니다. 8진수 표기법은 ECMAScript 버전에 따라 radix가 달라지기 때문인데요. ECMAScript 5 이전에는 8진수parseInt('030', 8)로 해석되었지만, 이후부터는 10진수로 해석됩니다. 따라서 이 경우에는 브라우저 환경에 따라 값이 달라질 수 있어 혼동이 생길 수 있습니다. (ECMAScript 5 이전 : 8진수 30 = 8*3 + 1*0 = 24 / ECMAScript 5 이후 : 10진수 30)
3번은 문자열 30을 숫자 30으로 리턴한 것을 볼 수 있습니다. JavaScript는 string이 16진수나 8진수 표기법이 아니라면, radix를 10으로 설정하기 때문입니다.

실제 비즈니스 로직에서 이 메소드를 사용한다면 radix를 꼭 지정해야 할 것 같습니다. 항상 10진수로 변환하고 싶은데 input데이터에 따라 radix가 결정된다면 예기치 못한 오류가 발생할 수 있으니까요.!