Javascript 에서 숫자 포맷(콤마) 설정하는 법

웹개발을 하다보면 금액을 다루는 페이지를 한 번쯤은 접하게 됩니다. 이런 페이지에서는 금액을 표현하다보니 숫자 데이터를 3자리마다 콤마(,)를 찍어줘야 하는 경우가 많습니다. 오늘은 Javascript에서 숫자 포맷 설정하는 법을 알아보도록 하겠습니다.

 

먼저 정규식 없이 사용하는 법을 알아보겠습니다. 일반적으로 많이 사용하는 방법으로 아래와 같은 함수를 만들어 사용합니다. 

function addComma(num){
    var len, point, str; 
       
    num = num + ""; 
    point = num.length % 3 ;
    len = num.length; 
   
    str = num.substring(0, point); 
    while (point < len) { 
        if (str != "") str += ","; 
        str += num.substring(point, point + 3); 
        point += 3; 
    } 
     
    return str;
}

 

다음으로 정규식 표현을 사용해 숫자 포맷을 생성하는 함수입니다.

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

 

위와 같은 함수를 만들어 사용할 경우 다음과 같은 방법으로 호출해 사용할 수 있습니다.

var num = "100000";
num = addComma(num);
console.log(num); //100,000

 

마지막으로 Javascript 내장 메소드를 사용해서 숫자 포맷을 생성하는 법을 알아보겠습니다.

var num = 100000;
console.log(num.toLocaleString()) //100,000

toLocaleString 함수를 사용하면 위와 같이 간단히 숫자 포맷을 나타낼 수 있습니다. 문자열로 굳이 변환할 필요도 없습니다. 이 함수는 기본값이 로컬로 설정됩니다. 한국의 경우 "ko-KR"로 나타나고 이 파라미터 값에 따라서 각 나라에 맞는 통화 표기 방식을 설정할 수 있습니다.