정규식 해설

Regex Explainer

정규식을 이름이 붙은 트리로 분해해 각 부분이 무엇을 잡는지 읽을 수 있게 합니다.

정규식을 트리로 쪼개서 각 조각이 무엇을 하는지 설명합니다. 그룹·수량자·문자 클래스·단언을 패턴의 구조 그대로 중첩해 보여 줍니다. 테스터와 같은 화면을 해설 탭에서 연 것입니다. 패턴을 읽는 일과 돌려 보는 일은 같은 활동이기 때문입니다.

🔒 브라우저 안에서만 처리regexexplainlearn

보기

패턴

//g

문자열 어디서든 일치 가능, 캡처 그룹 2개.

각 조각이 하는 일

([\w.+-]+)@([\w-]+\.[\w.-]+)차례대로

이것들이 사이에 아무것도 끼지 않은 채 차례로 모두 일치해야 합니다.

([\w.+-]+)1번 캡처 그룹

안쪽 패턴에 일치시키고 그 글자를 기억해 둡니다. `match[1]`로, 치환 문자열에서는 `$1`로 씁니다.

[\w.+-]++만큼 반복

1번 이상 반복하되, 되도록 많이 잡고 뒤쪽이 실패할 때만 내어 줍니다.

[\w.+-]이 집합에 있는 문자 하나

문자 하나에 일치합니다. 아래 것들 중 입력에 먼저 오는 것이 잡힙니다.

클래스 안에서 `.`은 마침표입니다. 여기서는 "아무 문자"라는 뜻이 아니고, 이스케이프해도 달라지지 않습니다.

\w아무 단어 문자

정확히 `[A-Za-z0-9_]`입니다.

ASCII만 해당합니다. 자바스크립트 정규식에서 `é`, `한`, `ß`는 단어 문자가 아니므로 `\w+`는 한글이나 악센트가 붙은 낱말에 일치하지 않습니다.

.“.” (U+002E) 문자 하나

대소문자까지 그대로 맞춥니다.

+“+” (U+002B) 문자 하나

대소문자까지 그대로 맞춥니다.

-“-” (U+002D) 문자 하나

대소문자까지 그대로 맞춥니다.

@“@” (U+0040) 문자 하나

대소문자까지 그대로 맞춥니다.

([\w-]+\.[\w.-]+)2번 캡처 그룹

안쪽 패턴에 일치시키고 그 글자를 기억해 둡니다. `match[2]`로, 치환 문자열에서는 `$2`로 씁니다.

[\w-]+\.[\w.-]+차례대로

이것들이 사이에 아무것도 끼지 않은 채 차례로 모두 일치해야 합니다.

[\w-]++만큼 반복

1번 이상 반복하되, 되도록 많이 잡고 뒤쪽이 실패할 때만 내어 줍니다.

[\w-]이 집합에 있는 문자 하나

문자 하나에 일치합니다. 아래 것들 중 입력에 먼저 오는 것이 잡힙니다.

\w아무 단어 문자

정확히 `[A-Za-z0-9_]`입니다.

ASCII만 해당합니다. 자바스크립트 정규식에서 `é`, `한`, `ß`는 단어 문자가 아니므로 `\w+`는 한글이나 악센트가 붙은 낱말에 일치하지 않습니다.

-“-” (U+002D) 문자 하나

대소문자까지 그대로 맞춥니다.

\.“.” (U+002E) 문자 하나

대소문자까지 그대로 맞춥니다.

여기서는 백슬래시가 필요 없습니다. 이 자리에서 이 문자는 특별한 뜻을 갖지 않습니다.

[\w.-]++만큼 반복

1번 이상 반복하되, 되도록 많이 잡고 뒤쪽이 실패할 때만 내어 줍니다.

[\w.-]이 집합에 있는 문자 하나

문자 하나에 일치합니다. 아래 것들 중 입력에 먼저 오는 것이 잡힙니다.

클래스 안에서 `.`은 마침표입니다. 여기서는 "아무 문자"라는 뜻이 아니고, 이스케이프해도 달라지지 않습니다.

\w아무 단어 문자

정확히 `[A-Za-z0-9_]`입니다.

ASCII만 해당합니다. 자바스크립트 정규식에서 `é`, `한`, `ß`는 단어 문자가 아니므로 `\w+`는 한글이나 악센트가 붙은 낱말에 일치하지 않습니다.

.“.” (U+002E) 문자 하나

대소문자까지 그대로 맞춥니다.

-“-” (U+002D) 문자 하나

대소문자까지 그대로 맞춥니다.

플래그

g — global: 첫 일치에서 멈추지 않고 모두 찾습니다. 대신 `.test()`와 `.exec()`가 호출 사이에 `lastIndex`를 옮기는데, "한 번 걸러 한 번씩 실패한다"는 증상은 대개 이것 때문입니다.

사용 방법

물려받은 패턴을 붙여넣습니다
설정 파일에 있는데 아무도 쓴 기억이 없는 그 패턴이죠. 문자열 비교가 아니라 파싱으로 읽어서, 분석이 실제 구조를 따릅니다.
트리를 따라 내려갑니다
노드마다 원문 조각과 그것이 무엇인지, 무슨 일을 하는지가 나옵니다. 사람들이 자주 놀라는 부분 — 중첩된 수량자, 굳이 캡처할 필요 없는데 캡처하는 그룹 — 에는 따로 표시가 붙습니다.
테스트로 바꿔 이해가 맞는지 확인합니다
패턴은 그대로 유지됩니다. 정규식을 이해하는 것과 생각대로 동작하는지 확인하는 것은 다른 단계이고, 둘 중 싼 쪽은 두 번째입니다.