정규 표현식 빠르게 – JavaScript Regex (초급부터 전문가까지)
발행: (2025년 12월 18일 오후 01:29 GMT+9)
5 min read
원문: Dev.to
Source: Dev.to
번역을 진행하려면 전체 텍스트(코드 블록 및 URL 제외)를 제공해 주시겠어요? 텍스트를 받는 대로 요청하신 대로 한국어로 번역해 드리겠습니다.
정규 표현식이란?
정규 표현식 (regex) 은 텍스트와 매치하기 위해 사용되는 패턴입니다.
JavaScript에서 regex는 주로 문자열과 함께 사용됩니다:
const text = "hello world";
text.match(/world/); // ['world']정규 표현식 패턴은 다음 구문으로 정의합니다:
/pattern/flags예시
/hello/ihello→ 패턴i→ 플래그 (대소문자 구분 없음)
정규식 작동 방식 (정신 모델)
정규식은 왼쪽에서 오른쪽으로, 문자 하나씩 읽으며 작동합니다.
- 엔진이 문자열을 읽습니다.
- 패턴과 일치시키려 시도합니다.
- 일치하지 않거나 성공할 때까지 진행합니다.
미스터리가 아니라 규칙일 뿐입니다.
JavaScript에서 정규식 만들기
-
리터럴 구문 (가장 일반적)
const regex = /abc/; -
생성자 구문 (동적 패턴)
const word = "abc"; const regex = new RegExp(word);패턴이 동적으로 필요할 때에만 생성자를 사용하십시오.
JavaScript에서 흔히 사용하는 정규식 메서드
| 메서드 | 설명 | 예시 |
|---|---|---|
test() | true / false 반환 | /abc/.test("abc123"); // true |
match() | 매치된 결과 반환 | "abc123".match(/abc/); |
replace() | 매치된 텍스트를 교체 | "hello world".replace(/world/, "JS"); |
search() | 매치된 인덱스를 반환 | "hello".search(/e/); // 1 |
문자와 리터럴
기본 매칭
/hello/ // matches "hello"Regex는 기본적으로 대소문자를 구분합니다.
/hello/i // matches "Hello", "HELLO", etc.특수 문자 (메타 문자)
다음 문자들은 특별한 의미를 가집니다:
. ^ $ * + ? ( ) [ ] { } | \문자 그대로 매치하려면 \\ 로 이스케이프하세요:
/\./ // matches a dot문자 클래스 [ ]
Set에서 한 문자와 매치:
/[abc]/ // a OR b OR c
/[0-9]/ // any digit
/[a-z]/ // lowercase letters
/[A-Z]/ // uppercase letters부정
/[^0-9]/ // NOT a digit축약 문자 클래스
| Pattern | Meaning |
|---|---|
\d | 숫자 (0–9) |
\D | 숫자가 아닌 |
\w | 단어 문자 (a–z, A–Z, 0–9, _) |
\W | 단어가 아닌 |
\s | 공백 문자 |
\S | 공백이 아닌 |
예시
/\d+/.test("123"); // true수량자 (몇 개?)
| 기호 | 의미 |
|---|---|
* | 0개 이상 |
+ | 1개 이상 |
? | 0 또는 1 |
{n} | 정확히 n 개 |
{n,} | n 개 이상 |
{n,m} | n 개와 m 개 사이 |
예시
/a*/ // "", "a", "aaaa"
/a+/ // "a", "aaaa"
/a{2}/ // "aa"탐욕적 매칭 vs. 게으른 매칭
Regex는 기본적으로 탐욕적입니다.
"test".match(/.+/);
// matches "test"게으른 버전
"test".match(/.+?/);
// matches ""양화자 뒤에 ?를 추가하면 게으르게 만들 수 있습니다.
앵커 ^ 와 $
앵커는 위치와 일치하며, 문자와는 일치하지 않습니다.
/^hello/ // starts with "hello"
/world$/ // ends with "world"검증에 유용합니다.
그룹 ( )
그룹을 사용하면 매치의 일부를 캡처할 수 있습니다.
const result = "2025-12-18".match(/(\d{4})-(\d{2})-(\d{2})/);
result[1]; // "2025" (연도)
result[2]; // "12" (월)
result[3]; // "18" (일)캡처되지 않는 그룹
/(?:abc)+/교체 | (OR)
/cat|dog/cat 또는 dog 중 하나와 일치합니다.
플래그
| Flag | 의미 |
|---|---|
g | 전역 |
i | 대소문자 구분 없음 |
m | 다중 행 |
s | 점이 줄바꿈과 일치 |
u | 유니코드 |
y | 스티키 |
예시
/hello/giLookahead와 Lookbehind
양수 전방 탐색
/\d(?=px)/ // 'px' 뒤에 오는 숫자부정 전방 탐색
/\d(?!px)/ // 'px' 뒤에 오지 않는 숫자Lookbehind (현대 JS)
정규식을 마스터하면 텍스트가 지저분하지 않게 됩니다.
구조화되고, 그 기술은 영원히 큰 도움이 됩니다.
더 보려면 팔로우하세요! @mahmud‑r‑farhan
Contact: https://gravatar.com/floawd