parseInt를 사용하여 문자형 데이터를 Number형 데이터로 바꾸기

 

UI개발을 하다보면 의도치않게 전달받은 데이터 형태가 String(문자형)데이터인데 연산이 필요한 경우가 발생하게 됩니다. 이럴때는 String(문자형) 데이터로 바로 연산이 불가능하기 때문에 String(문자형) 데이터를 Number(숫자)로 바꾸어서 처리를 해야 합니다.  그렇지 않으면 문자형 데이터에 숫자값을 넣었다고 해도 문자값 형태끼리 값을 더하게 되면 해당값은 숫자가 아닌 문자로 인식을 하고 두 문자데이터는 문자형으로 결합을 하게 되기 때문입니다.  지금은 무슨말인지 이해하지 못해도 괜찮습니다. 예제를 통해 확인하면 쉽게 이해될 수 있어요. 

 

그러면 String(문자형) 데이터를 Number(숫자) 형태의 값으로 바꾸기 위해서는 무엇을 해야 할까요?

바로 parseInt 함수를 사용하면 됩니다. 

parseInt를 사용할 때 한가지 주의할 점은 [parseInt("008");] 과 같이 변환을 하면 Firefox 나 Chrome 같은 브라우저에는 '8'로 값이  정상적으로 호출되지만 IE 브라우저에서는 0이 호출됩니다.

이런 현상을 방지하기 위해선 [parseInt("08", 10);] 이라고 적어줘야 IE에서도 정확한 값인 8이 호출되게 됩니다. 2번째 인자의 10은 10진수로 변환한다는 의미를 가지고 있습니다.

 

const a = '008';
const b = '200';
const total = a + b;
const total2 = parseInt(a, 10) + parseInt(b, 10);

alert(a);                 // 결과 : 008
alert(parseInt(a));       // 결과 : 0
alert(parseInt(a, 10));   // 결과 : 8

alert(total);             // 결과 : 008200 <= 문자열로 결합된 형태
alert(total2);            // 결과 : 208    <= 정상적인 숫자형태로 결합된 형태