[javascript] 문자열에 숫자 포맷 적용하기

07 Dec 2023

javascript

toLocaleString() 메소드 사용하기

toLocaleString() 메소드는 숫자를 현지화된 문자열로 변환해주는 기능을 합니다. 이를 활용하여 숫자에 원하는 포맷을 적용할 수 있습니다.

const number = 1234567890;
const formattedNumber = number.toLocaleString();
console.log(formattedNumber); // "1,234,567,890"

위의 예제에서 toLocaleString() 메소드를 사용하여 숫자를 포맷 적용된 문자열로 변환했습니다.

정규식과 replace 메소드 사용하기

정규식과 replace() 메소드를 활용하면 숫자 포맷을 직접 정의하여 적용할 수 있습니다. 다음은 세 자리마다 쉼표(,)를 추가하는 포맷을 적용하는 예제입니다.

const number = 1234567890;
const formattedNumber = number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
console.log(formattedNumber); // "1,234,567,890"

위의 예제에서는 toString() 메소드를 사용하여 숫자를 문자열로 변환한 후, 정규식 \B(?=(\d{3})+(?!\d))을 적용하여 세 자리마다 쉼표를 추가했습니다.

numeral.js 라이브러리 사용하기

numeral.js는 숫자 포맷을 다루기 위한 유용한 라이브러리입니다. 이 라이브러리는 다양한 숫자 포맷 옵션을 제공하며, 자세한 사용법은 공식 문서를 참고하시기 바랍니다.

먼저, numeral.js 라이브러리를 프로젝트에 추가해야 합니다. CDNs 또는 npm을 통해 설치할 수 있습니다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>

다음은 numeral.js를 활용한 예제입니다.

const number = 1234567890;
const formattedNumber = numeral(number).format('0,0');
console.log(formattedNumber); // "1,234,567,890"

위의 예제에서는 numeral() 함수를 사용하여 숫자를 numeral 객체로 변환한 후, format() 메소드를 사용하여 원하는 포맷을 지정했습니다.

이처럼 자바스크립트에서 문자열에 숫자 포맷을 적용하는 방법을 알아보았습니다. 각 방법을 활용하여 숫자를 원하는 형식으로 표시할 수 있습니다.

참고 자료