자바스크립트 replace() 전체 문서에 적용하기

개체 내에서 특정 문자(character) 또는 문자열(string)을 치환하여 출력하거나 인자로서 전달하고자 할 때 자바스크립트의 replace() 메소드를 사용할 수 있다. replace()는 찾고자 하는 값과 치환할 값을 매개변수로 전달받는다.

코드 불러오는 중...

위의 예시에 있는 버튼을 클릭하면 치환 함수가 실행되는데, 첫 번째 매개변수 값과 일치하는 최초의 값만이 두 번째 매개변수 값으로 치환된다는 것을 알 수 있다. 이는 버그가 아니라 최초 일치값만 치환하도록 설계된 replace() 메소드의 스펙이다.

Java 라이브러리에는 정규식 치환을 위한 replaceAll() 클래스가 존재하지만 자바스크립트에는 이러한 메소드가 제공되지 않는다. jQuery에 동명의 메소드가 있지만 Java의 replaceAll()과는 다른 기능을 갖는다.

그렇다면 치환 범위 내에서 검색된 모든 일치값을 치환하기 위해서는 어떤 방법을 생각해볼 수 있을까?

replace() 메소드의 매개변수에는 정규 표현식(regexp)의 사용이 가능하다. 정규 표현식에서 전역 매치를 위한 제어자(modifier)인 g를 첫 번째 매개변수에 적용하면 아래와 같은 결과를 출력한다.

코드 불러오는 중...

제어자 i는 소문자, 대문자 여부를 무시하고(case insensitive) 문자 또는 문자열의 일치를 판단한다. /gi는 소문자, 대문자 여부를 무시하고 전역 매칭을 수행하여 아래와 같은 결과를 출력한다. 매개변수에 특수문자가 포함되어 있을 경우 정규식 문법으로 인식하기 때문에 특수문자 앞에는 반드시 백슬래쉬(\)를 삽입하여 escape 처리하도록 한다. 정규 표현식에 관한 자세한 내용은 MDN 문서 중 정규식 부분을 참고(한글, 클릭하면 이동).

코드 불러오는 중...

위의 예시에서는 간단히 문자열을 매개변수로 전달했지만 변수(variable)를 전달해야 할 때는 아래 코드와 같이 RegExp(변수명, '제어자') 함수를 이용하도록 한다. 이 경우 특수문자의 escape 처리도 정규식을 활용하는 것이 효율적이다.

코드 불러오는 중...