JavaScript 숫자에 콤마(쉼표) 추가하기 - 천 단위 구분

원본 작성일: 2014.02.14
보완 작성일: 2026.02.14

숫자를 표시할 때 1000000보다 1,000,000이 읽기 편하다. JavaScript에서 천 단위 콤마를 추가하는 여러 방법을 정리한다.

방법 1: for 루프 (원본)

function addComma(str) {
    str = String(str);
    var len = str.length;
    var result = '';
    for (var i = 0, j = len; i < len; i++, j--) {
        if (j % 3 === 0 && j !== len) {
            result += ',';
        }
        result += str.charAt(i);
    }
    return result;
}

addComma('1000000');   // "1,000,000"
addComma('12345');     // "12,345"

뒤에서부터 3자리마다 콤마를 넣는 방식이다. j가 뒤에서 몇 번째인지를 추적한다.

방법 2: 정규식

function addComma(num) {
    return String(num).replace(/\B(?=(\d{3})+(?!\d))/g, ',');
}

addComma(1000000);    // "1,000,000"
addComma(9876543);    // "9,876,543"

정규식이 복잡해 보이지만 한 줄이면 끝난다. \B는 단어 경계가 아닌 위치, (?=(\d{3})+(?!\d))는 뒤에 3자리 숫자 그룹이 오는 위치를 찾는다.

방법 3: toLocaleString (가장 간단)

(1000000).toLocaleString();        // "1,000,000"
(1234567.89).toLocaleString();     // "1,234,567.89"

소수점도 자동 처리된다. 로케일에 따라 구분자가 달라진다 (독일은 마침표, 한국/미국은 콤마).

방법 4: Intl.NumberFormat (가장 유연)

const formatter = new Intl.NumberFormat('ko-KR');
formatter.format(1000000);         // "1,000,000"

// 소수점 자리수 지정
const precise = new Intl.NumberFormat('ko-KR', {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2
});
precise.format(1234567.8);         // "1,234,567.80"

어떤 걸 쓸까

방법	장점	단점
for 루프	이해하기 쉬움	코드가 김, 소수점 미처리
정규식	한 줄	읽기 어려움
toLocaleString	간단, 소수점 자동	포맷 세부 제어 어려움
Intl.NumberFormat	유연, 로케일 지원	약간 장황

추천: 단순 표시는 toLocaleString(), 세밀한 제어가 필요하면 Intl.NumberFormat.