JavaScript / 내림, 올림, 반올림
JavaScript에서 정수로 내림할 때는 Math.floor(), 올림할 때는 Math.ceil(), 가장 가까운 정수로 반올림할 때는 Math.round()를 사용합니다. 음수에서는 내림이 0에 가까워지는 동작이 아니며, round에서 두 정수까지의 거리가 같으면 더 큰 정수를 선택합니다.
내림, 올림, 반올림의 방향
Math.floor(1.6); // 1 Math.ceil(1.4); // 2 Math.round(1.5); // 2 Math.floor(-1.4); // -2 Math.ceil(-1.4); // -1 Math.round(-1.5); // -1
floor는 입력값 이하의 정수 중 가장 큰 값을, ceil은 입력값 이상의 정수 중 가장 작은 값을 반환합니다. round는 가장 가까운 정수를 선택하고, 정확히 중간이면 양의 무한대 방향을 선택합니다. 따라서 -1.5의 반올림 결과를 -2라고 예상하면 안 됩니다. Math.floor(), Math.ceil(), Math.round()의 정의를 기준으로 비교하세요.
| 입력 | floor | ceil | round | trunc |
|---|---|---|---|---|
| 1.4 | 1 | 2 | 1 | 1 |
| 1.5 | 1 | 2 | 2 | 1 |
| 1.6 | 1 | 2 | 2 | 1 |
| -1.4 | -2 | -1 | -1 | -1 |
| -1.5 | -2 | -1 | -1 | -1 |
| -1.6 | -2 | -1 | -2 | -1 |
소수 부분만 버리려면 Math.trunc()
Math.trunc()는 소수 부분을 버리고 0 방향으로 이동합니다. 양수에서는 floor와 같은 결과가 나오지만, 음수에서는 다릅니다. “소수점 아래를 버림”이라는 요구가 음수에도 적용된다면 floor를 사용할지 trunc를 사용할지 먼저 정해야 합니다.
Math.floor(-1.9); // -2 Math.trunc(-1.9); // -1
자세한 동작은 Math.trunc() 설명에서 확인할 수 있습니다. Math.round(-0.5)는 일반 표시에서 0으로 보일 수 있는 음의 0(-0)을 반환하며, 구분이 필요하면 Object.is(result, -0)으로 검사할 수 있습니다.
처리할 자릿수 변경하기
Math.round(1.25 * 10) / 10; // 1.3: 소수 첫째 자리까지 Math.floor(1.256 * 100) / 100; // 1.25: 소수 둘째 자리까지 Math.ceil(1.251 * 100) / 100; // 1.26: 소수 둘째 자리까지 Math.round(1234567 / 1000) * 1000; // 1235000: 천 단위로 반올림
소수 d자리까지 남기려면 10의 d제곱을 곱해 정수 단위에서 처리한 뒤 다시 나눕니다. 천 단위처럼 정수의 큰 자릿수로 반올림하려면 해당 단위로 나눈 뒤 처리하고 다시 곱합니다. “소수 둘째 자리에서 반올림”은 보통 소수 첫째 자리까지 남긴다는 뜻이므로, 버릴 위치와 남길 위치를 명확히 적어야 합니다.
소수 오차와 화면 표시를 구분하기
Math.round(1.005 * 100) / 100; // 1: 십진 소수를 정확히 저장하지 못함 (1.2).toFixed(2); // "1.20" typeof (1.2).toFixed(2); // "string"
Number는 이진 부동소수점 형식으로 저장되므로 일부 십진 소수는 근삿값이 됩니다. 곱한 결과가 기대한 중간값보다 조금 작으면 반올림 결과도 달라질 수 있습니다. Number.EPSILON을 더하는 방식이 모든 크기·음수·자릿수 문제를 해결한다고 가정하지 마세요. 정확한 십진 계산이 필요한 작업은 정수 단위와 범위를 정하거나, 요구하는 반올림 규칙을 지원하는 십진 연산 도구를 별도로 선택해야 합니다.
toFixed()는 지정한 소수 자릿수로 표시하는 문자열을 반환합니다. 뒤의 0이 필요하면 그 문자열을 화면에 사용하고, 다시 Number로 바꾸면 표시용 0은 사라집니다. 이 함수도 원래 Number의 근삿값에 기반하므로 정확한 십진 계산을 대신하지 않습니다. toFixed()의 반환값과 정밀도를 참고하세요.
전체 실행 예제
코드를 UTF-8의 rounding.html로 저장해 브라우저로 여세요. 앞의 비교 표와 각 행을 대조하고, 음수와 소수 오차 예제를 함께 확인할 수 있습니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>내림, 올림, 반올림 비교</title>
<style>
body { margin: 24px; font: 16px/1.7 sans-serif; }
input, button, select { font: inherit; max-width: 100%; }
label { display: block; margin-top: 12px; }
#output { white-space: pre-wrap; overflow-wrap: anywhere; }
</style>
</head>
<body>
<p>양수와 음수에서 결과가 어떻게 다른지 확인합니다.</p>
<pre id="output" aria-live="polite"></pre>
<script>
const values = [1.4, 1.5, 1.6, -1.4, -1.5, -1.6];
const lines = values.map(value =>
`${value}: floor ${Math.floor(value)} / ceil ${Math.ceil(value)} / round ${Math.round(value)} / trunc ${Math.trunc(value)}`
);
lines.push(`소수 첫째 자리까지: ${Math.round(1.25 * 10) / 10}`);
lines.push(`천 단위: ${Math.round(1234567 / 1000) * 1000}`);
lines.push(`부동소수점 주의: ${Math.round(1.005 * 100) / 100}`);
lines.push(`표시 형식: ${(1.2).toFixed(2)} / 자료형: ${typeof (1.2).toFixed(2)}`);
document.getElementById("output").textContent = lines.join("\n");
</script>
</body>
</html>
마지막 부분에는 소수 첫째 자리까지: 1.3, 천 단위: 1235000, 부동소수점 주의: 1이 표시됩니다. 문자열 입력을 처리한다면 먼저 Number() 변환과 유한한 숫자 검사를 적용하세요. NaN이나 무한대에 이 메서드를 호출한다고 정상적인 정수가 되는 것은 아닙니다.
JavaScript의 숫자 표시, URI 인코딩·디코딩과 검색 매개변수 생성 코드를 정리합니다. 오래된 escape() 사용과 IE8용 선택자 보완 메모를 현재 코드에 적용할 때의 차이도 설명합니다.
JavaScript / 함수 / String() - 숫자를 문자열로 변환하는 함수
String()으로 숫자를 문자열로 바꾸는 방법과 덧셈·문자열 연결의 차이를 설명합니다. 빈 값, new String(), 숫자 표시 형식의 주의점도 확인할 수 있습니다.
JavaScript / 숫자에 천 단위 쉼표 추가하는 방법, 제거하는 방법
toLocaleString()과 Intl.NumberFormat으로 천 단위 쉼표를 표시하고, 쉼표가 있는 입력을 검증해 숫자로 변환하는 방법을 설명합니다. 소수·음수·큰 정수의 한계도 다룹니다.
JavaScript / 반복문 / while, do - while, for
while, do...while, for의 실행 순서와 선택 기준을 비교합니다. 0부터 9까지 출력하는 전체 예제와 무한 반복, break·continue의 주의점을 설명합니다.
JavaScript / 조건문 / if, else if, else, switch
if·else if·else와 switch로 실행 경로를 선택하는 방법을 설명합니다. 입력값 검증, 엄격한 비교, break 누락과 case의 실행 범위를 예제로 확인할 수 있습니다.
JavaScript / 함수 / Number() - 문자열을 숫자로 변환하는 함수
Number()로 문자열을 숫자로 변환하는 문법과 빈 문자열·NaN·Infinity 처리 방법을 설명합니다. 입력값 검사와 parseInt(), parseFloat()의 차이도 예제로 비교합니다.
Math.floor(), Math.ceil(), Math.round()의 차이와 음수의 처리 방향을 비교합니다. 자릿수 변경, Math.trunc()와의 차이, 소수 오차와 표시 형식도 함께 설명합니다.