Lab | JavaScript, 가격(숫자) 천 단위에서 콤마 찍는 방법이 있을까?
숫자는 천단위에서 주로 콤마를 찍는다.
가독성을 높여주며 더욱 익숙한 형태이다.
1. 고민해보자
하지만 자바스크립트에는 숫자를 다양한 방식으로 보여주는 기능이 없다.
아무리 찾아봐도 없다. (있다면 댓글로 알려주십셔)
하지만 없다고 못할 우리가 아니다.... 기본적인 메서드를 이용해서 찍어보자.
2. 해결해보자
1) toString
: 숫자로 안되면 String으로 바꿔보자.
.toString()
- Number의 내장 메서드인
toString
을 이용해서 먼저 텍스트로 바꾸어준다. toString
은 어떤 형태도 전부 스트링으로 변환시켜준다.
2) replace
: replace로 하나의 규칙을 만들고 그 규칙에 따라 쉼표를 찍어보자.
.replace(패턴, ',')
- replace는 어떤 패턴에 일치하는 일부 또는 모든 부분이 교체된 새로운 문자열을 반환한다.
- 즉, 3번째라는 패턴마다 해당부분에
,
라는 문자열로 교체하면 되는 것이다.
3) 정규 표현식
: replace에서 패턴은 정규 표현식으로 표현할 수 있다.
/\B(?=(\d{3})+(?!\d))/g
/
는 시작점과 끝점을 의미한다.- 끝점 뒤의 i, g, m은 플래그라고 부르며 검색방법에 해당한다.
- 나는 g(Global)을 이용할 것이다.
4) 최종
: 3가지 모두를 이용하면 아래와 같아진다.
Number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
- Number에 쉼표를 찍고싶은 숫자를 넣으면 된다!! 성공이다. 참쉽죠?
Author And Source
이 문제에 관하여(Lab | JavaScript, 가격(숫자) 천 단위에서 콤마 찍는 방법이 있을까?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@xedni/Lab-리액트-천-단위에서-콤마-찍는-방법저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)