본문으로 바로가기

[JavaScript] replaceAll 사용하는 방법

프로그래밍을 하다 보면 문자를 변경해야 하는 경우가 많이 생긴다. 그렇기 때문에 문자열에서 해당하는 문자를 모두 변경시켜주는 함수가 언어마다 존재하는 경우가 많이 있다. 보통 replaceAll과 같은 함수를 제공하는데 JavaScript에서는 해당 함수를 제공하지 않는다. 따라서 replace 함수를 이용하여 replaceAll과 같은 기능을 할 수 있도록 구현을 해야한다. 해당 게시글에서는 그 방법을 알아보도록 하자.

replace 함수를 이용하여 replaceAll처럼 사용하는 방법

쉽게 생각해보면 아래와 같이 총 3가지 방법이 있다.

  • 1. 해당 문자열에 변경하고 싶은 문자가 몇 개 있는 지 아는 경우
  • 2. 반복문을 사용하여 해당 문자를 모두 제거하는 경우
  • 3. 정규식을 사용하는 경우

본 게시물에서는 순서대로 3가지 방법 모두 사용을 해보려고 한다.

3가지 방법

사용될 문자열과 문자는 아래와 같다.

변경 : "#" -> ""

변경 전 문자열 : "동#해물#과 백두#산이#"

변경 후 문자열 : "동해물과 백두산이"

1. 해당 문자열에 변경하고 싶은 문자가 몇 개 있는 지 아는 경우

이 경우는 replace 함수를 변경하고 싶은 문자 개수만큼 사용하면 된다. 아래 예시 문장을 보면 #이 총 4개 있다. 그럼 replace를 총 4번 하면 된다. 아래 CODEPEN을 클릭하여 console을 확인해보자.

See the Pen replace all - 1 by Codiving (@codiving) on CodePen.

2. 반복문을 사용하여 해당 문자를 모두 제거하는 경우

이 경우도 크게 어렵지 않다. replace를 하였는데 변경 전 문자열과 변경 후 문자열 길이가 동일하면 더 이상 해당 문자열이 존재하지 않는 것을 이용하면 된다. 아래 CODEPEN을 클릭하여 console을 확인해보자.

See the Pen replace all - 2 by Codiving (@codiving) on CodePen.

3. 정규식을 사용하는 경우

정규식을 사용하는 경우가 사실 제일 깔끔하다. "변경하고 싶은 문자열".replace(/변경이될문자/gi, "변경하고싶은문자") 처럼 사용하면 된다. 아래 CODEPEN을 클릭하여 console을 확인해보자.

See the Pen VwmzZEB by Codiving (@codiving) on CodePen.

결론

정규식을 사용하여 replaceAll처럼 사용하자. "변경하고 싶은 문자열".replace(/변경이될문자/gi, "변경하고싶은문자")

마지막

해당 내용은 틀릴 수도 있다는 것을 감안하여 봐주세요. 틀린 내용 및 오탈자 수정 요청 환영입니다.

반응형