사용 방법
- 슬래시 사이에 패턴을 넣고 플래그를 고릅니다. g는 모든 일치 찾기, i는 대소문자 무시, m은 ^와 $를 줄마다 적용, s는 .이 줄바꿈과도 일치, u는 유니코드 모드입니다.
- 테스트할 텍스트를 입력하거나 붙여 넣습니다. 입력하는 동안 일치 부분이 강조되고, 목록에 각 일치의 위치와 그룹이 표시됩니다.
- 치환을 미리 보려면 $2-$1이나 $<name> 같은 치환 문자열을 넣습니다. 치환 결과가 맨 아래에 나옵니다.
예시
패턴 (\d+)-(?<word>[a-z]+), 플래그 g, 텍스트: order 12-apple, order 7-pear and 305-fig
→ 3개 일치: 12-apple, 7-pear, 305-fig$<word>#$1로 치환하면 order apple#12, order pear#7 and fig#305가 됩니다.
패턴 a*, 플래그 g, 텍스트: baac
→ 4개 일치: 위치 0의 빈 일치, 1의 aa, 3과 4의 빈 일치아무것도 일치하지 않을 수 있는 패턴은 글자 사이의 빈 틈에도 일치합니다.
패턴 ^\w+, 플래그 g와 m, 두 줄의 텍스트: one, two
→ 2개 일치: one과 twom이 없으면 ^는 전체 텍스트의 시작에서만 일치합니다.
계산 방식
패턴과 플래그는 브라우저의 RegExp 객체에 그대로 전달되고, g 플래그가 켜져 있으면 String.prototype.matchAll로, 꺼져 있으면 exec 한 번으로 일치 항목을 모읍니다. 각 일치마다 위치, 일치한 텍스트, 번호 그룹, 이름 그룹이 표시됩니다.
강조된 텍스트는 일반 텍스트 조각으로 만들어지므로, 붙여 넣은 내용은 HTML로 해석되지 않고 텍스트로만 표시됩니다. 목록에는 최대 1000개의 일치가 나옵니다.
일치 검사는 웹 워커에서 2초의 제한 시간으로 실행됩니다. 제한에 걸리면 워커를 중단하고 다음 변경 때 새 워커를 시작하므로, 느린 패턴이 페이지를 멈추게 할 수 없습니다.
출처
자주 묻는 질문
- 어떤 정규식 문법을 쓰나요?
- JavaScript 문법입니다. 브라우저가 실행하는 엔진과 같아서 자바스크립트나 타입스크립트 코드에서 얻는 결과와 일치합니다. PCRE, Python, Java 같은 다른 언어는 세부가 다릅니다. 예를 들어 (?i) 같은 인라인 플래그나 소유 한정자를 지원하지만 JavaScript에는 없습니다.
- 패턴이 2초 뒤에 중단된 이유는 무엇인가요?
- 긴 a 문자열 뒤에 다른 문자가 오는 입력에 (a+)+$ 같은 패턴을 쓰면 엔진이 일치 방법을 지수적으로 많이 시도하는데, 이를 치명적 백트래킹이라고 합니다. 도구는 패턴을 별도의 워커에서 실행하고 2초가 지나면 중단하므로 페이지는 계속 동작합니다.
- 치환에서 $1과 $<name>은 무엇인가요?
- $1은 첫 번째 캡처 그룹의 텍스트, $2는 두 번째 그룹을 넣습니다. $<name>은 이름 있는 그룹, $&는 일치 전체를 넣습니다. 문자 그대로의 달러 기호는 $$로 적습니다.
- 치환이 첫 번째 일치만 바꾸는 이유는 무엇인가요?
- g 플래그가 없으면 패턴은 한 번만 일치하고 한 번만 치환합니다. 모든 일치를 바꾸려면 g를 켜세요.
- 입력한 텍스트가 업로드되나요?
- 아니요. 모든 것이 브라우저 안에서 실행되며 서버로 전송되지 않습니다.