자바스크립트 Math 함수 총정리 — 반올림부터 랜덤, 숫자 변환까지

가격을 표시하거나 점수를 계산할 때는 숫자를 다듬어야 합니다. 이 글은 Math 객체와 숫자 변환 함수를 찾아보는 사전입니다. 표로 훑은 뒤 기능별 예제와 실행 결과를 확인하겠습니다.

함수 하는 일 반환값
Math.round(n) 가까운 정수로 반올림 정수
Math.floor(n) 작은 쪽 정수로 내림 정수
Math.ceil(n) 큰 쪽 정수로 올림 정수
Math.trunc(n) 소수점 버림 정수
Math.abs(n) 절댓값 숫자
Math.max(a, b) 가장 큰 값 숫자
Math.min(a, b) 가장 작은 값 숫자
Math.pow(a, b) a의 b제곱 숫자
Math.sqrt(n) 제곱근 숫자
Math.random() 0 이상 1 미만 난수 소수
n.toFixed(d) 소수점 d자리로 맞춤 문자열
parseInt(s) 앞부분을 정수로 정수, 실패 시 NaN
parseFloat(s) 앞부분을 소수로 소수, 실패 시 NaN
Number.isNaN(v) 값이 NaN인지 확인 true / false

이 함수들은 원본 값을 바꾸지 않고 계산 결과를 새로 돌려줍니다. 변수 개념이 흐릿하다면 자바스크립트 변수 편을 먼저 보십시오.

소수점 정리 — round, floor, ceil, trunc

넷 다 정수를 주지만 음수에서 결과가 갈립니다.

const rating = 4.6;
console.log(Math.round(rating));  // 5
console.log(Math.floor(rating));  // 4
console.log(Math.ceil(rating));   // 5
const delta = -4.6;
console.log(Math.floor(delta));   // -5  더 작은 쪽으로 갑니다
console.log(Math.trunc(delta));   // -4  소수점만 버립니다
console.log(Math.round(-4.5));    // -4  0.5는 큰 쪽으로 갑니다

floor는 “수직선에서 왼쪽”, trunc는 “소수점 잘라 버리기”입니다. 음수가 나올 수 있는 값에는 무엇을 쓸지 정해 두어야 합니다.

크기 다루기 — abs, max, min, pow, sqrt

두 값의 차이, 최고 점수, 제곱 계산에 쓰는 묶음입니다.

console.log(Math.abs(95 - 120));   // 25  부호 없이 변화량만
console.log(Math.max(82, 95, 60)); // 95
console.log(Math.min(82, 95, 60)); // 60
const scores = [82, 95, 60, 77];
console.log(Math.max(scores));     // NaN  배열은 그대로 넣을 수 없습니다
console.log(Math.max(...scores));  // 95   점 세 개로 펼쳐 넣습니다

console.log(Math.pow(2, 10));      // 1024  (2 ** 10 과 같습니다)
console.log(Math.sqrt(144));       // 12

Math.max는 값을 하나씩 나열해 받으므로 배열을 통째로 넣으면 NaN이 되고, ...(전개 구문)으로 펼쳐야 합니다. 배열은 자바스크립트 배열 함수 편에 있습니다.

무작위 수 만들기 — random

Math.random()0 이상 1 미만의 소수를 돌려줍니다. 1은 절대 나오지 않습니다.

console.log(Math.random());  // 0.7213... 매번 다릅니다

const dice = Math.floor(Math.random() * 6) + 1;
console.log(dice);  // 1 ~ 6 중 하나

const posts = ["변수 편", "함수 편", "배열 편"];
console.log(posts[Math.floor(Math.random() * posts.length)]); // "함수 편"
const min = 10, max = 20;   // min 이상 max 이하 정수를 뽑는 공식
console.log(Math.floor(Math.random() * (max - min + 1)) + min); // 10 ~ 20

round를 쓰면 양 끝 숫자의 확률만 절반이 되어 고르지 않습니다. 난수 범위는 floor를 쓰고 + 1로 보정하십시오.

숫자와 문자열 사이 — toFixed, parseInt, parseFloat

사용자 입력은 언제나 문자열로 들어옵니다. 계산하려면 숫자로 바꿔야 합니다.

const price = 12345.678;
console.log(price.toFixed(2));         // "12345.68"  ← 숫자가 아닌 문자열
console.log(Number(price.toFixed(2))); // 12345.68    ← 다시 숫자로

console.log(parseInt("12강"));    // 12   앞부터 읽다가 숫자가 아니면 멈춥니다
console.log(parseInt("강12"));    // NaN  첫 글자부터 숫자가 아니면 실패
console.log(parseFloat("3.5kg")); // 3.5
console.log(Number("12강"));      // NaN  Number는 전체가 숫자여야 합니다

결과가 문자열임을 놓치면 "12345.68" + 100처럼 이어붙이기가 됩니다. 계속 계산하려면 Number()로 되돌리십시오.

자주 하는 실수 — NaN 판별과 소수 오차

끝까지 발목을 잡는 두 가지입니다.

// 실수 1: NaN은 자기 자신과도 다릅니다
const wrong = Number("abc");
console.log(wrong === NaN);        // false  이렇게 비교하면 안 됩니다
console.log(Number.isNaN(wrong));  // true   이렇게 확인합니다

// 실수 2: 소수 계산에는 미세한 오차가 있습니다
console.log(0.1 + 0.2);            // 0.30000000000000004
console.log(0.1 + 0.2 === 0.3);    // false
console.log(Math.abs(0.1 + 0.2 - 0.3) < 0.0001); // true  이렇게 비교합니다

컴퓨터는 소수를 2진수로 근사해 저장하므로 작은 오차가 생깁니다. 돈처럼 정확해야 하는 값은 100을 곱해 정수로 계산한 뒤 나누는 방식이 안전합니다.

핵심 정리

  • Math는 도구 상자Math.함수()로 바로 씁니다.
  • 음수 주의floor는 작은 쪽, trunc는 소수점만 버립니다.
  • random — 0 이상 1 미만, 범위는 floor+ 1로 만듭니다.
  • toFixed — 결과는 문자열입니다.
  • NaN 확인Number.isNaN()을 씁니다.