JavaScript - 문자열을 숫자로 변환하는 방법

Javascriptnumber

자바스크립트에서 문자열(String)을 숫자(Number)로 변환하는 다양한 방법을 소개합니다.

1. Number()로 문자열을 숫자로 변환

Number()는 인자로 전달된 문자열을 Number로 변환합니다. 숫자가 아닌 문자나 undefined 등을 인자로 전달하면 NaN(Not A Number)를 리턴합니다. NaN의 의미는 숫자가 아니라는 것이지만 NaN 객체의 타입을 보면 number인데요. 여기서 NaN은 숫자로 표현이 안되지만 객체의 타입은 Number라고 보시면 될 것 같습니다.

const str = '1234';

const num1 = Number(str);
const num2 = Number('1234.5');
const num3 = Number(undefined);
const num4 = Number('abcd');

console.log(num1 + ', ' + typeof num1);
console.log(num2 + ', ' + typeof num2);
console.log(num3 + ', ' + typeof num3);
console.log(num4 + ', ' + typeof num4);

Output:

1234, number
1234.5, number
NaN, number
NaN, number

NaN은 왜 number 타입을 리턴하는지에 대해서 더 알아보고 싶으시다면 StackOverflow - Why does typeof NaN return 'number'?의 답변을 참고하시면 좋을 것 같습니다.

2. parseInt()로 문자열을 숫자로 변환

parseInt()는 인자로 전달된 문자열을 정수의 Number로 변환합니다. 소수를 갖고 있는 실수는 정수로 변환되기 때문에 이 부분을 고려하셔야 합니다.

const str = '1234';

const num1 = parseInt(str);
const num2 = parseInt('1234.5');
const num3 = parseInt(undefined);
const num4 = parseInt('abcd');

console.log(num1 + ', ' + typeof num1);
console.log(num2 + ', ' + typeof num2);
console.log(num3 + ', ' + typeof num3);
console.log(num4 + ', ' + typeof num4);

Output:

1234, number
1234, number
NaN, number
NaN, number

3. parseFloat()로 문자열을 숫자로 변환

소수를 갖고 있는 실수를 문자열 변환할 때는 parseFloat()를 사용하시면 됩니다.

const str = '1234';

const num1 = parseFloat(str);
const num2 = parseFloat('1234.5');
const num3 = parseFloat(undefined);
const num4 = parseFloat('abcd');

console.log(num1 + ', ' + typeof num1);
console.log(num2 + ', ' + typeof num2);
console.log(num3 + ', ' + typeof num3);
console.log(num4 + ', ' + typeof num4);

Output:

1234, number
1234.5, number
NaN, number
NaN, number

4. Math로 문자열을 숫자로 변환

Math의 ceil(올림), round(반올림), floor(버림) 메소드들은 인자로 문자열을 받으며 숫자로 변환합니다. 올림, 반올림, 버림 등의 처리를 하여 정수로 변환되기 때문에, 소수를 갖고 있는 실수는 정수로 변환된다는 것을 고려해야 합니다.

const str = '1234.1';

const num1 = Math.ceil(str);
const num2 = Math.floor('1234.6');
const num3 = Math.round('1234.5');
const num4 = Math.round('1234.4');

console.log(num1 + ', ' + typeof num1);
console.log(num2 + ', ' + typeof num2);
console.log(num3 + ', ' + typeof num3);
console.log(num4 + ', ' + typeof num4);

Output:

1235, number
1234, number
1235, number
1234, number

참고로, Math는 문자열이 아닌 숫자도 인자로 받을 수 있으며, 결과는 위와 동일합니다.

const num1 = Math.ceil(1234.1);
const num2 = Math.floor(1234.6);
const num3 = Math.round(1234.5);
const num4 = Math.round(1234.4);

console.log(num1 + ', ' + typeof num1);
console.log(num2 + ', ' + typeof num2);
console.log(num3 + ', ' + typeof num3);
console.log(num4 + ', ' + typeof num4);

Output:

1235, number
1234, number
1235, number
1234, number

References

Loading script...

Related Posts

codechachaCopyright ©2019 codechacha