정규표현식으로 replace를 replaceAll 처럼 사용하기

자바스크립트의 replace 메써드는 처음 나오는 매칭 1개만을 바꿉니다.

매칭되는 전체를 바꾸려면 루프를 돌아서 처리하거나, jQuery의 replaceAll 메써드를 사용해야 합니다.

jQuery를 사용한다면 큰 문제가 되지 않겠지만, 자바스크립트만으로 사용하려면 꽤나 불편한 점이 있습니다.

정규표현식을 사용하면 jQuery의 replaceAll 과 같은 효과를 낼 수 있습니다.

예를 들어

var str = "This is javascript replace example."

str.replace('pl','');

을 하면

"This is javascript reace example."

이렇게 처음 나오는 "pl"만 사라지고 뒤에 나오는 "pl"은 그대로 남게 됩니다.

이걸 정규표현식을 사용해 아래와 같이 하면

str.replace(/pl/gi,'');

아래와 같은 문자열이 반환됩니다.

"This is javascript reace exame."

실행 결과를 확인하고 싶으면

크롬 웹브라우저를 실행한 후 F12를 눌러 개발자도구를 연후 2번째 탭인 "Console"을 클릭해 콘솔창을 활성화 한 후

var str = "This is javascript replace example."

str.replace(/pl/gi,'');

이 내용을 그대로 복사해 콘솔창에 붙여넣은 후 엔터를 누르면 확인할 수 있습니다.

replace() 메써드로 변경할 소스 문자열("pl") 을 정규표현식으로 변경해 대입만 해주면 됩니다.

정규표현식

/pl/gi

는 다음과 같은 뜻을 가집니다.

변경할 문자열을 슬래시("/") 로 감싸고 

g: 전역으로 검색(전체 변경)

i: 대소문자 무시

m: 여러줄 검색(여러줄로 된 문자열 데이터나 파일을 읽은 경우 사용)

차기 자바스크립트 표준에는 replaceAll() 메써드가 추가되겠지만, 아직은 지원이 되고 있지 않습니다.

프로젝트나 여러 파일에서 자바스크립트 파일을 공유해 사용하는 경우 문자열 객체에 replaceAll() 메써드를 사용자 정의해서 replaceAll() 메써드를 사용할 수 있습니다.

    String.prototype.replaceAll = function(search, replacement) {        var target = this;        return target.replace(new RegExp(search, 'gi'), replacement);    };

이렇게 사용자 정의 메써드를 문자열 객체에 추가해주면 이후에 사용하는 모든 코드에서 replaceAll() 메써드를 사용할 수 있게 됩니다.