Javascript 문자열의 모든 발생을 대체하는 방법은 무엇입니까?

https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62에서 Amazon에서 내 책을 확인하십시오.

지금 http://jauyeung.net/subscribe/에서 내 이메일 목록을 구독하십시오.

문자열의 모든 항목을 바꾸는 것은 JavaScript 앱에서 자주 수행해야 하는 작업입니다.

이 기사에서는 JavaScript 앱에서 모든 문자열을 바꾸는 방법을 살펴보겠습니다.

String.prototype.replaceAll

replaceAll 메서드는 ES2021부터 JavaScript 문자열의 일부로 사용할 수 있는 새로운 메서드입니다.

Chrome, Edge 또는 Firefox와 같은 많은 최신 브라우저에서 지원됩니다.

그것을 사용하기 위해 다음과 같이 작성합니다.

const result = "1 abc 2 abc 3".replaceAll("abc", "def");

첫 번째 인수는 교체하려는 문자열입니다.

그리고 두 번째 인수는 교체하려는 문자열입니다.

따라서 result는 '1 def 2 def 3'  .

분할 및 결합

문자열을 교체하려는 문자열로 분할하고 원래 문자열을 교체하려는 문자열로 호출join할 수도 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

const result = "1 abc 2 abc 3".split("abc").join("def");

'abc'를 구분 기호로 사용하여 문자열을 분할하고 join를 사용하여 'def'를 호출합니다.

그리고 동일한 결과가 반환됩니다.

정규식 바꾸기

주어진 패턴으로 문자열을 새 문자열로 바꿀 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

const result = "1 abc 2 abc 3".replace(/abc/g, 'def');

모든 인스턴스'abc'를 'def'로 바꾸려면  .
g 플래그는 주어진 패턴을 가진 모든 인스턴스를 찾습니다.
RegExp 생성자를 사용하여 정규식 개체를 만들 수도 있습니다.

const result = "1 abc 2 abc 3".replace(new RegExp('abc', 'g'), 'def');

while 루프 및 포함

includes 메서드를 사용하여 문자열에 지정된 하위 문자열이 있는지 확인할 수 있습니다.

따라서 지정된 하위 문자열이 있는 경우 includes는 true 를 반환합니다.

따라서 while 루프와 함께 사용하여 조건에서 includes를 사용하여 하위 문자열의 모든 인스턴스를 새 인스턴스로 바꿀 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

let str = "1 abc 2 abc 3";  
while (str.includes("abc")) {  
  str = str.replace("abc", "def");  
}

값을 다시 할당할 수 있도록 let를 사용합니다.

유일한 단점은 str 변수를 변경해야 한다는 것입니다.

결론

JavaScript에서 하위 문자열의 모든 인스턴스를 다른 인스턴스로 바꾸는 방법에는 여러 가지가 있습니다.

모든 하위 문자열을 교체하는 가장 새롭고 쉬운 방법은 ES2021과 함께 제공되며 최신 브라우저에서 사용할 수 있는 replaceAll 메서드를 사용하는 것입니다.