자바스크립트 replace() 문자열 대체하고 바꾸기

“replace()” 함수는 JavaScript 문자열에서 지정된 패턴 또는 문자열을 찾아 다른 문자열로 대체하는 데 사용합니다. “replace()” 함수를 사용하면 문자열에서 원하는 패턴을 찾아서 다른 문자열로 대체할 수 있으며, 정규 표현식을 활용하여 더 유연한 대체 작업을 수행할 수 있습니다.

 

 

 

 

◎ 구문

 

string.replace(searchValue, newValue)

l  “string”: 대상 문자열입니다.

l  “searchValue”: 찾을 문자열 또는 정규 표현식 패턴입니다.

l  “newValue”: 대체할 문자열입니다.

 

 

◎ 1. 단순 문자열 대체

 

"JavaScript"을 "Python"으로 대체하고 새 문자열을 생성합니다. 변경해야 할 2개의 문자 중 첫 번째만 변경하고 끝납니다.

 

const sentence = "I love JavaScript. JavaScript is fun.";
const newSentence = sentence.replace("JavaScript", "Python");
 
console.log(newSentence);
 
[출력]
I love Python. JavaScript is fun.

 

 

◎ 2. 전체 문자열 변경하기

 

전체 문자열에 걸쳐서 특정 문자열을 모두 바꾸고 싶다면, 정규표현식(RegExp)과 함께 g (전역 플래그)를 사용해야 합니다.

 

const sentence = "I love JavaScript. JavaScript is fun.";
const newSentence = sentence.replace(/JavaScript/g, "Python");
 
console.log(newSentence);
 
[출력]
I love Python. Python is fun.

 

 

◎ 3. 정규 표현식 사용

 

대소문자 구분 없이 "world"를 "planet"으로 대체합니다. g는 "global"의 약자로, 문자열 전체에서 'world'를 찾아서 'planet'으로 바꾸라는 의미입니다. i는 "ignore case"의 약자로, 대소문자 구분 없이 'world'를 찾아서 'planet'으로 바꾸라는 의미입니다.

 

const text = "Hello, World! It's a beautiful world.";
const newText = text.replace(/world/gi, "planet");
 
console.log(newText);


[출력]
Hello, planet! It's a beautiful planet.

 

 

◎ 4. 함수를 사용한 대체

 

함수를 사용하여 "apples"를 "red fruits"로, "bananas"를 "yellow fruits"로 대체합니다.

 

const text = "Apples are red, bananas are yellow.";
const newText = text.replace(/apples|bananas/g, function (match) {
  return match === "apples" ? "red fruits" : "yellow fruits";
});
 
console.log(newText);
 
[출력]
Apples are red, yellow fruits are yellow.

 

 

◎ 5. 빈 공백 전체 제거 하기

 

“replace()” 함수를 사용하여 문자열에서 공백을 제거하는 예제는 다음과 같습니다:

 

const originalString = "  This is a sample string with spaces.  ";
const stringWithoutSpaces = originalString.replace(/\\s/g, "");
 
console.log(stringWithoutSpaces);

 

 

코드에서는 정규 표현식 “/s/g”를 사용하여 문자열에서 모든 공백 문자를 찾고, 이를 빈 문자열로 대체합니다. 결과로 문자열 "Thisisasamplestringwithspaces."가 출력됩니다. “replace()” 함수에서 사용한 정규 표현식 “/s/g”는 다음과 같이 구성됩니다:

 

l  “/”: 정규 표현식 패턴의 시작과 끝을 나타냅니다.

l  “\\s”: 공백 문자를 나타냅니다. “\\s”는 스페이스, 탭, 줄 바꿈 및 다른 공백 문자를 모두 포함합니다.

l  “g”: 글로벌 플래그(Global Flag)를 나타냅니다.