Chrome 73에서는 String.prototype.matchAll() 메서드를 도입합니다. match()와 유사하게 작동하지만 전역 또는 고정 정규 표현식의 모든 정규 표현식 일치가 포함된 반복자를 반환합니다. 특히 캡처 그룹에 액세스해야 하는 경우 일치 항목을 반복하는 간단한 방법을 제공합니다.
match()에 어떤 문제가 있나요?
캡처 그룹을 사용하여 전역 일치를 반환하려는 경우가 아니라면 짧게 말씀드리면 아무것도 없습니다. 다음은 프로그래밍 퍼즐입니다. 다음 코드를 살펴보세요.
const regex = /t(e)(st(\d?))/g;
const string = 'test1test2';
const results = string.match(regex);
console.log(results);
// → ['test1', 'test2']
콘솔에서 이를 실행하면 문자열 'test1' 및 'test2'가 포함된 배열이 반환됩니다. 정규 표현식에서 g 플래그를 삭제하면 모든 캡처 그룹이 포함되지만 첫 번째 일치만 반환됩니다. 상태 메시지가 표시됩니다.
['test1', 'e', 'st1', '2', index: 0, input: 'test1test2', groups: undefined]
이 문자열에는 'test2'로 시작하는 두 번째 일치 항목이 포함되어 있지만 이 항목은 없습니다. 이제 퍼즐을 풀어 보겠습니다. 각 일치에 대해 모든 캡처 그룹을 가져오려면 어떻게 해야 하나요? String.prototype.matchAll() 제안서 설명에서는 가능한 두 가지 접근 방식을 보여줍니다. 더 이상 필요하지 않으므로 설명하지 않겠습니다.
String.prototype.matchAll()
matchAll()를 사용하면 설명 동영상 예시가 어떻게 표시되나요? 바로 여기서 볼 수 있습니다.
const regex = /t(e)(st(\d?))/g;
const string = 'test1test2';
const matches = string.matchAll(regex);
for (const match of matches) {
console.log(match);
}
이 경우 몇 가지 사항에 유의해야 합니다. 전체 검색에서 배열을 반환하는 match()와 달리 matchAll()는 for...of 루프와 함께 멋지게 작동하는 반복자를 반환합니다. 반복자는 몇 가지 추가 항목이 있는 캡처 그룹을 포함하여 각 일치에 관한 배열을 생성합니다. 콘솔에 출력하면 다음과 같이 표시됩니다.
['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', groups: undefined]
['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', groups: undefined]
각 일치의 값은 전역이 아닌 정규 표현식의 경우 match()에서 반환한 것과 정확히 동일한 형식의 배열입니다.
보너스 자료
이 도움말은 정규식을 처음 접하거나 정규식 전문가가 아닌 사용자를 대상으로 합니다. match() 및 matchAll()의 결과(반복마다)는 이름이 지정된 추가 속성이 있는 배열임을 알 수 있습니다. 이 도움말을 준비하는 과정에서 이러한 속성에 MDN에 문서가 부족하다는 점을 발견했습니다 (해결함). 다음은 간단한 설명입니다.
index- 원래 문자열에서 첫 번째 결과의 색인입니다. 위의 예에서
test2은 5번 위치에서 시작하므로index의 값은 5입니다. inputmatchAll()가 실행된 전체 문자열입니다. 이 예에서는'test1test2'입니다.groups- 정규 표현식에 지정된 이름이 지정된 캡처 그룹의 결과를 포함합니다.
결론
누락된 부분이 있으면 아래 댓글을 통해 알려주세요. JavaScript의 최근 변경사항에 대한 자세한 내용은 이전 업데이트 또는 V8 웹사이트를 참고하세요.