IT 성장일기

[Javascript] replace 함수 3차원으로 활용하기(feat. 정규식) 본문

Script/Javascript

[Javascript] replace 함수 3차원으로 활용하기(feat. 정규식)

고 양 2024. 11. 14. 15:23
반응형
replace 함수 3차원으로 활용하기(feat. 정규식)

replace

자바스크립트에서 제공하는 replace 함수는 문자열의 특정 키워드 한 개를 원하는 키워드로 치환시켜 주는 함수입니다.

let text = 'black white'

text.replace('black', 'white');

정말 자주 사용하는 함수이지만 아쉽게도 한 번 사용할 때마다 한 개의 키워드만 치환할 수 있습니다.

let text = 'black white black black white white black'

text.replace('black', 'white');

가장 처음에 마주친 키워드만 치환된다

그래서 replace 함수를 1차원 함수라고 혼자 정의했습니다.

replaceAll

물론 큰 문제가 되지는 않습니다. replaceAll 함수는 문자열의 모든 특정 키워드를 치환해 줍니다.

let text = 'black white black black white white black'

text.replaceAll('black', 'white');

하지만 replaceAll 함수에도 아쉬운 점이 있습니다. 바로 대소문자를 구분한다는 거죠.

let text = 'black white Black black white white BLACK'

text.replaceAll('black', 'white');

대소문자가 구분된다

그래서 또 혼자 replaceAll 함수를 2차원 함수라고 정의 내렸습니다.

replace + regular expression

그렇다면 문자열 전체에서 대소문자 구분 없이 키워드를 치환하는 방법이 없을까요?

편리한 방법이 있습니다. 바로 찾고자 하는 키워드를 정규식으로 작성하는 방법입니다.

 

사용방법은 아래와 같습니다.

  1. 찾고자 하는 텍스트를 슬래쉬( / )로 감싼다.
  2. 전역(global)을 뜻하는 g 플래그를 붙인다.
  3. 대소문자를 구분하지 않도록(Insensitive) i 플래그를 붙인다.

이렇게 하면 replace 함수 하나만으로도 문자열 전체에서 특정 키워드를 찾으며 대소문자 구분 없이 키워드를 치환해 줍니다.

let text = 'black white Black black white white BLACK'

text.replace(/black/gi, 'white');

편-안

저는 이렇게 해서 replace 함수를 3차원으로 사용합니다.

 

도움이 되어드렸다면 공감은 됐고 광고 한 번만 눌러주세요😄

감사합니다!

반응형