어제 오늘 내일

[Javascript] 숫자 콤마 제거 하는 2가지 방법 본문

IT/Javascript

[Javascript] 숫자 콤마 제거 하는 2가지 방법

hi.anna 2021. 1. 16. 14:14

 

지난번에는 숫자에 세자리마다 콤마를 추가하는 방법을 알아보았습니다.

이번에는 콤마가 있는 숫자 문자열에서 콤마를 제거하는 방법을 정리해 보도록 하겠습니다.

 

1. replace() 함수 사용하기
2. split(), join() 함수 사용하기

 

 

1. replace() 함수 사용하기

const numberStr = "123,456,789";

// 콤마 제거
const number = numberStr.replace(",", "");
document.write(number);

 

숫자 문자열의 콤마를 제거하기 위해서 replace() 함수를 사용하였습니다.

replace() 함수는 2개의 파라미터를 입력받고,

문자열에서 첫번째 파라미터(여기서는 ",")를 두번째 파라미터(여기서는 "")로 치환해 줍니다.

그런데, 결과를 보니 모든 콤마가 제거 된 것 같지는 않네요.

replace() 함수는 첫번째로 첫번째로 발견한 값만 치환해 주기 때문입니다.

그래서, 문자열 전체에서 모든값(첫번째 파라미터와 일치하는)을 치환해 주기 위해서는

반복문을 사용하거나 정규식을 사용해야 합니다.

 

const numberStr = "123,456,789";

// 전체 콤마 제거
const number = numberStr.replace(/,/g, "");
document.write(number);

 

위 예제는 replace()의 첫번째 파라미터로 일반 문자열 대신 정규식을 넣어주었습니다.

/,/g

이 정규식은 매우 간단한 정규식입니다.

정규식은 '/'로 감싸서 작성합니다.

즉, '/,/'은 단순히 ','(콤마)를 찾는 정규식입니다.

그리고, 뒤에 붙은 'g'는 문자열 전체에서 콤마를 찾도록 해주는 플래그 입니다.

(정규식의 'g'를 한번 삭제하고 실행해 보세요. 그러면, 이전 예제와 같이 첫번째 콤마만 삭제됩니다.)

 

 

2. split(), join() 함수 사용하기

const numberStr = "123,456,789";

// 전체 콤마 제거
const number = numberStr.split(',').join("");
document.write(number);

 

일반적으로 첫번째 예제인 replace() 함수와 정규식을 많이 사용하지만

split()과 join() 함수를 사용해서 콤마를 제거할 수도 있습니다.

 

split()

split() 함수는 문자열을 첫번째 파라미터(여기서는 ',')로 잘라서 배열로 반환하는 함수입니다.

위 예제에서는 ["123", "456", "789"] 를 리턴하겠죠?

 

join()

join() 함수는 배열의 모든 요소를 연결해 하나의 문자열로 만들어 줍니다.

split() 함수가 리턴한 값이 ["123", "456", "789"] 이니까

이 배열의 문자열을 모두 연결하면, "123456789"가 되겠죠?

 


 

javascript에서 콤마가 있는 숫자에서 콤마를 제거하는 방법을 정리해 보았습니다.

 

 

반응형
Comments