[javascript] 숫자 3자리 단위마다 콤마(comma) 찍기

숫자형식의 값을 화면에 보여줄때에는 화폐단위처럼 숫자 3자리마다 콤마(comma)를 추가해주면 가독성이 좋아진다.

프로그래밍 언어별로 이러한것을 처리하기 위해 숫자를 특정 형식대로 포맷팅 해줄수가 있는데, 자바스크립트는 그러한 기능이 없다. 물론 우리들이 흔하게 사용하년 jQuery에도 그러한 기능은 없다. (jQuery는 숫자형식을 컨트롤 하는 플러그인이 있다)

그렇기 때문에 숫자를 화페단위처럼 3자리마다 콤마를 넣어주긴 위해선 해당 기능을 하는 함수를 만들어서 사용해야 한다.

일반적으로 인터넷에서 검색했을때 제일 많이 나오는 함수는 아래와 같다.

function comma(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;
}

위의 함수의 경우 나와 같이 일을 하는 막내직원이 어디선가 긁어와서 사용중인 함수인데, 위와 같이 while문을 통해
자릿수마다 콤마를 추가하고 있다.

위 방법보다는 공백제거 함수처럼 정규식을 사용할수 있지 않을까 해서 검색해보니 stackoverflow에 떡하니 있다 !!

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

심플하다 !!

 

참고 : https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript