결과
function commaNumber(num) {
if (typeof num !== 'string' && typeof num !== 'number') {
return num;
}
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
}분석하기
- \B는 경계(맨 앞, 맨 뒤, white space가 없는 경우)가 아닌 단어에 매칭된다.
- 구분자(,)를 삽입할 때 경계선에 삽입하는 경우
,123혹은123,이 될 수 있기 때문에 넣어준다.
- 구분자(,)를 삽입할 때 경계선에 삽입하는 경우
- x+는 x가 1회 이상 반복되는 경우 일치한다.
- \d{3}+ 를 예시로 들면 1234567에서 앞에서 부터 123456과 456에 매칭된다. 이 코드에서는 \B와 접목시켜 234567과 567을 매칭시키고 그 앞에 콤마를 붙이기 위해 사용되었다.
- x(?!y) x 뒤에 y가 없는 경우에만 x와 일치한다. (negated lookahead)
- (?!\d) 이 식이 빠진다면, 456도 매칭이되고 567도 매칭이 되며, 모든 3자리 숫자에 매칭이 되기 때문에 맨 뒤의 567을 제외한 모든 구간에 콤마가 붙게 된다.
'123456'.match(/(\d{3})+(?!\d)/);
// 이 코드는 3개의 숫자가 1번이라도 반복되며, 뒤따라오는 숫자가 없는 경우에 일치한다 즉, 123456, 456이 선택된다.
'123456'.match(/\B(\d{3})+(?!\d)/g);
// 이 코드는 경계를 무시하기 때문에, 456만이 매칭된다.- x(?=y) x 뒤에 y가 따라오는 경우에만 x와 일치한다. (lookahead)
- 123과 456의 사이를 찾기 위해 사용된다.
'123456'.replace(/(?=([6]))/g, ',');
// 이 코드는 6만을 찾는다 하지만 6이 반드시 뒤따라 와야하며, ?= 의 x자리가 비어있기 때문에 5와 6사이의 경계를 가리키게 된다. 즉 반환 값은 12345,6 이다.
'123456'.match(/\B(?=(\d{3})+(?!\d)/g));
// 따라서 이 코드는 숫자 3이 1번 이상 반복되는 숫자 이면서 그 뒤에는 숫자가 없는 456과 앞 문자 123의 경계에 매칭이 된다.- g 플래그를 붙이면 replace의 경우 표현식과 매칭되는 모든 단어를 치환한다. 따라서 붙여준다.
'1234567'.match(/\B(?=(\d{3})+(?!\d)/));
// 1,234567
'1234567'.match(/\B(?=(\d{3})+(?!\d)/g));
// 1,234,567참고문서
Front 💔 End