JS/jQuery - 천단위(3자리수)마다 콤마 넣기 : toLocaleString(), replace()

닌니디자인 JS 썸네일

 

toLocaleString() 함수

toLocaleString() 메소드는 숫자를 통화 형식으로 표시하거나, 날짜와 시간을 로컬 시간대에 맞는 형식으로 표시해주기 때문에 toLocaleString() 메소드를 이용하여 숫자 3단위마다 콤마를 넣을 수 있다. 

wb_incandescent Tip

toLocaleString()메소드는 현재 지역 설정에 따라 변환된 값을 반환한다.
따라서 결과는 각 사용자의 로컬 설정에 따라 다를 수 있다.

 

예시

var number = 123456789;
console.log(number.toLocaleString()); 
// "123,456,789" 
// 인자없이 사용하면 사용자의 로컬 설정에 따라 반환

console.log(number.toLocaleString('ko-KR')); 
// "123,456,789" 
// 로컬을 인자로 넣어 정확하게 표현

check_circle Check

toLocaleString() 메소드를 이용하려면 꼭 Number 타입에 사용해야 한다.
Number 타입이 아닌 문자열에 사용하면 오류반환.

 

 

replace() 함수 (feat. 정규식)

replace() 함수는 문자열에서 지정된 패턴 또는 문자열을 다른 패턴 또는 문자열로 치환하기 때문에 문자열 내의 특정 부분을 변경하거나 제거할 수 있다. replace() 함수와 정규식을 이용하여 숫자 3단위마다 콤마를 넣을 수 있다. 

 

예시

var num = 123456789
console.log(num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","))
// 123,456,789

check_circle Check

replace() 메소드는 첫 번째로 일치하는 부분만 치환한다. 일치하는 모든 부분을 치환하려면 정규식을 사용하고, g플래그를 추가하여 전역 검색을 수행해야한다.

 

 

---

 

domain_verification Source

Number.prototype.toLocaleString() - JavaScript | MDN