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);
# 결과
# 1234, number
# 1234.5, number
# NaN, number
# NaN, 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);
# 결과
# 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);
# 결과
# 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);
# 결과
# 1235, number
# 1234, number
# 1235, number
# 1234, number
-> Math는 문자열이 아닌 숫자도 인자로 받을 수 있고 결과는 위와 동일합니다.
'JavaScript' 카테고리의 다른 글
[JavaScript] Object 타입일 때, 속성(요소) 관련된 함수와 개수 세는 법 (0) | 2023.12.21 |
---|---|
[JavaScript] findIndex() 함수 설명 (0) | 2023.12.21 |
[Javascript] find() 함수와 filter() 함수의 공통점과 차이점 (0) | 2023.12.18 |
[Javascript] 배열의 요소가 어떤 값을 포함하고 있는지 구하는 방법 includes() (0) | 2023.12.16 |
[Javascript] 현재 날짜, 시간 구하기 (0) | 2023.12.16 |