
안녕하세요~ 경제적 자유입니다.
오늘은 JavaScript의 숫자형(Number)을 리뷰해보려고 합니다.
OverView
JavaScript에서 숫자는 정말 자주 사용됩니다.
가격을 계산할 때, 배열의 길이를 다룰 때, 점수를 비교할 때, 반복문의 인덱스를 증가시킬 때 모두 숫자를 사용하죠.
또한 나눗셈 과 나머지를 구하는 연산자는 있지만 몫을 구하는 방법은 조금 다릅니다.
오늘은 JavaScript에서 숫자를 표현하는 방법, 숫자를 반올림하는 방법, 문자열을 숫자로 바꾸는 방법, 그리고 숫자 계산에서 조심해야 할 부분까지 정리해보겠습니다.
추가로 더 자세히 공부하고 싶다면 아래 MDN 문서를 참고해보세요.
- 참고 링크: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Number
- 참고 링크: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math
개념 설명
1. 숫자형이란?
JavaScript의 Number는 숫자를 표현하는 자료형입니다.
다른 언어에서는 정수, 실수, 소수 등을 구분해서 다루는 경우가 많지만, JavaScript에서는 일반적인 숫자를 대부분 Number 하나로 다룹니다
또한 JavaScript에서는 e표기법을 사용할 수 있습니다.
console.log(1e3); // 1000
console.log(1e6); // 1000000
console.log(7.3e9); // 7300000000
2. 16진수, 2진수, 8진수
JavaScript에서는 10진수뿐만 아니라 16진수, 2진수, 8진수도 표현할 수 있습니다.
let hex = 0xff;
let binary = 0b11111111;
let octal = 0o377;
console.log(hex); // 255
console.log(binary); // 255
console.log(octal); // 255
각 접두사는 다음과 같습니다.
0x // 16진수
0b // 2진수
0o // 8진수
3. toString(base)이란?
toString(base)는 숫자를 특정 진법의 문자열로 바꿔주는 메서드입니다.
let num = 255;
console.log(num.toString(16)); // "ff"
console.log(num.toString(2)); // "11111111"
console.log(num.toString(10)); // "255"
여기서 중요한 점은 결과가 숫자가 아니라 문자열이라는 것입니다.
4. 어림수 구하기 : Math.floor, Math.ceil, Math.round, Math.trunc
Math.floor()
Math.floor()는 내림입니다.
주어진 숫자보다 작거나 같은 정수 중 가장 큰 정수를 반환합니다.
console.log(Math.floor(3.9)); // 3
console.log(Math.floor(3.1)); // 3
console.log(Math.floor(-1.1)); // -2
양수에서는 단순히 소수점을 버리는 것처럼 보입니다.
하지만 음수에서는 주의해야 합니다.
console.log(Math.floor(-1.1)); // -2
-1.1보다 작거나 같은 정수 중 가장 큰 값은 -2입니다.
Math.ceil()
Math.ceil()은 올림입니다.
console.log(Math.ceil(3.1)); // 4
console.log(Math.ceil(3.9)); // 4
console.log(Math.ceil(-1.1)); // -1
Math.round()
Math.round()는 반올림입니다.
console.log(Math.round(3.1)); // 3
console.log(Math.round(3.6)); // 4
Math.trunc()
Math.trunc()는 소수 부분을 그냥 잘라냅니다.
console.log(Math.trunc(3.9)); // 3
console.log(Math.trunc(-1.9)); // -1
5. toFixed()란?
toFixed()는 숫자를 고정 소수점 표기법으로 바꿔주는 메서드입니다.
쉽게 말하면 소수점 아래 몇 자리까지 보여줄지 정하는 기능입니다.
let price = 12.3456;
console.log(price.toFixed(2)); // "12.35"
console.log(price.toFixed(1)); // "12.3"
console.log(price.toFixed(0)); // "12"
6. Infinity와 NaN
Infinity
Infinity는 무한대를 의미합니다.
console.log(1 / 0); // Infinity
console.log(-1 / 0); // -Infinity
또 너무 큰 숫자를 표현하려고 하면 Infinity가 될 수 있습니다.
console.log(1e500); // Infinity
NaN
NaN은 Not a Number의 줄임말입니다.
즉, 숫자가 아니라는 뜻입니다.
console.log("hello" / 2); // NaN
NaN과 Infinite를 확인하기 위해서는 isNaN()과 isFinite()을 확인하는 것이 좋다고 합니다.
7. parseInt와 parseFloat
문자열에서 숫자를 꺼내야 할 때 parseInt()와 parseFloat()를 사용할 수 있습니다.
parseInt()
parseInt()는 문자열을 정수로 변환합니다.
console.log(parseInt("100px")); // 100
console.log(parseInt("12.34")); // 12
문자열 앞에서부터 읽다가 숫자로 해석할 수 없는 부분을 만나면 멈춥니다.
console.log(parseInt("100px")); // 100
console.log(parseInt("px100")); // NaN
"100px"는 앞부분 100을 숫자로 읽을 수 있지만, "px100"은 시작부터 숫자가 아니기 때문에 NaN이 됩니다.
parseFloat()
parseFloat()는 소수까지 변환합니다.
console.log(parseFloat("12.34px")); // 12.34
console.log(parseFloat("12.34.56")); // 12.34
마무리
오늘은 JavaScript의 몫을 어떻게 구하는 방법과 그와 관련된 숫자형에 대해서 정리하였습니다.
실제로 몫을 구하는 문제 또는 공간에 일정 크기의 도형을 집어넣는 문제에 대해서 Math.floor()을 굉장히 많이 사용한 기억이 나네요.. ㅠㅠ
그리고 문자인지 숫자인지를 보기위해서는 Number.isNaN()같은 메서드가 필요하다고 생각합니다.
공부 화이팅!

'웹 개발 > Javascript' 카테고리의 다른 글
| [JavaScript(15)] 배열 메서드 이해하기 (0) | 2026.06.07 |
|---|---|
| [JavaScript(14)] includes()로 문자열 안에 글자 찾기? 문자열 이해하기 (0) | 2026.05.31 |
| [JavaScript(12)] 생성자 함수? 객체 리터럴과의 차이 (0) | 2026.05.31 |
| [JavaScript(11)] 가비지 컬렉션, 메모리는 언제 사라질까? (0) | 2026.05.31 |
| [JavaScript(10)] 객체 복사(Object.assign()과 structuredClone()) (0) | 2026.05.31 |
