본문 바로가기
IT 개발

[JavaScript] 자바스크립트 replace

by Angela- 2025. 1. 23.

 

replace() 함수

문자열의 특정 부분을 검색하여 다른 문자열로 교체(replace)하는 함수입니다.

특정 문자열이나 정규 표현식 패턴을 사용하여 원본 문자열 내에서 대상을 검색하고,
검색된 부분은 원하는 문자열로 교체되어 반환됩니다.
원본 문자열은 변경되지 않습니다.

 

구문

str.replace(searchValue, newValue);

 

str은 찾을 대상이 되는 원본 문자열입니다
searchValue 
교체될 문자열을 검색하는 방법입니다.
찾을 대상이 되는 특정 문자열 또는 정규 표현식 패턴을 지정할 수 있습니다.
newValue
교체하는 새로운 문자열을 지정하는 방식입니다.
searchValue를 찾았을 때 교체할 새로운 문자열 또는 함수를 지정할 수 있습니다.
인수에 문자열을 지정하면 해당 문자열을 처음 발견한 위치에서 교체합니다.
인수에 함수를 지정하면 해당 함수가 교체할 문자열을 반환합니다.

 

const str = "I like a apple";
const replacedStr = str.replace("apple", "orange");

console.log(replacedStr); 
// "I like a orange"
console.log(str); 
//"I like a apple"

 

 

● 특정 문자열로 검색할 경우

const originalString = "Hello, Jane !  Hello, Tom !";
const newString = originalString.replace("Hello", "Hi");

// 검색된 부분은 원하는 문자열로 교체되어 반환됩니다.
// 이때, 검색된 문자열에서 첫 번째로 일치하는 부분만 교체합니다.
console.log(newString); 
// "Hi, Jane ! Hello, Tom !"

// 원본 문자열은 변경되지 않습니다.
console.log(originalString); 
//  "Hello, Jane ! Hello, Tom !"

특정 문자열로 검색할 경우, 검색된 문자열에서 첫 번째로 일치하는 부분을 교체합니다.


● 정규 표현식 패턴으로 검색할 경우

const originalString = "I like the number 32";
const newString = originalString.replace(/\d+/, "**");
// \d+는 하나 이상의 숫자를 나타내는 정규 표현식

// 검색된 부분은 원하는 문자열로 교체되어 반환됩니다.
console.log(newString); 
// I like the number **

// 원본 문자열은 변경되지 않습니다.
console.log(originalString); 
// I like the number 32

정규 표현식 패턴도 검색된 문자열에서 첫 번째로 일치하는 부분만 교체합니다.

 


g 플래그가 있는 정규 표현식 패턴을 사용하면 모든 일치하는 부분을 교체할 수 있습니다.
g 플래그의 g는 global을 의미하며, 문자열 내의 모든 일치하는 패턴을 전역적으로 검색하여 교체하겠다는 뜻입니다.

 

const text = "apple banana apple";

// g 플래그 사용
const result = text.replace(/apple/g, "orange");
console.log(result);  
// "orange banana orange"

// g 플래그 사용하지 않음
const resulNotg = text.replace(/apple/, "orange");
console.log(resulNotg);  
// "orange banana apple"