ES2021로 모두 교체

The newly introduced replaceAll() method removes the need for using a regex

JavaScript에서 strings로 작업한 적이 있다면 문자열에서 일치하는 하위 문자열을 모두 바꾸는 것이 얼마나 힘든 일인지 알 것입니다!

좋아, 내가 여기서 약간 극적일 수도 있지만 확실히 초보자로서 쉽게 할 수 있는 일이 아니었다.

예를 들어, 내가 처음 JavaScript 작업을 시작했을 때(당시에는 프로그래밍에 상당히 익숙하지 않았음) string 에서 단어의 모든 발생을 바꾸고 싶었을 때 어떻게 해야 할지 알 수 없었습니다. replace() 메서드의 설명서를 읽습니다.

문자열에서 발생하는 모든 단어를 바꾸는 것과 같은 간단한 작업을 수행하기 위해 regex과 같이 복잡한 것을 사용해야 하는 이유가 궁금했습니다. 나는 아직 아니다).

어쨌든 ES2021 , 해당 작업에 regex 를 사용할 필요가 없습니다!

그 이유는 ES2021 이 주어진 문자열에서 하위 문자열의 모든 발생을 교체하기 위한 새로운(그리고 오랫동안 기다려온) 유틸리티 방법을 도입했기 때문입니다: regex .

내가 말하는 내용을 더 잘 이해할 수 있도록 예를 들어 보겠습니다.

let aString = "I love Java. Java is very very easy to learn. Java's a very popular programming language"

let newString = aString.replaceAll("Java","JavaScript")

console.log(newString)

//I love JavaScript! JavaScript is very very easy to learn. JavaScript's a very popular programming language!

다음은 Chrome 콘솔에서 위 코드의 실행을 나타내는 gif입니다(예, Chrome은 이미 이 기능을 제공했으며 다른 브라우저도 마찬가지입니다).


Chrome 콘솔에서 'replaceAll()' 메서드 사용을 묘사하는 gif. 이미지 크레딧: Pratik Chaudhari
replaceAll() 메서드는 원래 문자열을 그대로 유지하고 새 문자열을 반환합니다.

여기서 replaceAll()는 대상 하위 문자열을 검색하는 동안 대소문자를 구분하여 비교합니다.

'Java'의 대문자 'J'를 소문자 'j'로 바꿔도 replaceAll()는 바꾸지 않고 새 문자열은 이전 문자열과 비슷합니다.

내가 의미하는 바를 보여주는 또 다른 gif가 있습니다.


소문자 'j'를 사용할 때 'replaceAll()'의 동작을 묘사하는 gif. 이미지 크레딧: Pratik Chaudhari

그것의 사촌 replaceAll() , replace() 와 마찬가지로 대상 하위 문자열(즉, 대체할 하위 문자열) 대신 정규식을 지정할 수 있지만 그렇게 하면 replaceAll() 를 사용하는 전체 목적을 무산시킬 것입니다.
replaceAll() 에 대해 자세히 알아보려면 해당 MDN 설명서를 참조하십시오.

이것이 이 기사의 전부입니다, 여러분!

이 글을 읽고 새로운 것을 배웠기를 바랍니다.