Articles
JavaScript 소개
`RegExp` 객체

`RegExp` 객체

이 글은 RegExp 객체에 대해 설명합니다.

실제 예제를 통해 RegExp 객체를 설명하겠습니다.

YouTube Video

RegExp 객체

RegExp란 무엇인가요?

RegExp(정규 표현식)는 문자열 패턴을 나타내기 위한 객체입니다. 간단한 문자 비교와 달리, '특정 조건을 만족하는 문자열'을 유연하게 정의할 수 있습니다.

RegExp 객체를 사용하면 문자열 검색, 검증, 추출, 치환 등의 작업을 간결하고 명확하게 수행할 수 있습니다. 폼 입력 검증, 로그 분석, 텍스트 포매팅 등 일상적인 작업에 매우 효과적입니다. 아래는 정규식의 간단한 예시들입니다.

1const pattern = /abc/;
  • 이 정규 표현식은 'abc'라는 문자열이 포함되어 있는지를 확인합니다.

정규 표현식 생성 방법 (두 가지 방식)

RegExp 문법에는 리터럴 표기법과 생성자 표기법 두 가지가 있습니다.

1// Literal notation: pattern and flags are written together
2const literal         = /hello/;
3const literalWithFlag = /hello/i;
4const literalDigits   = /\d+/;
5
6// Constructor notation: pattern and flags are passed separately
7const constructor         = new RegExp("hello");
8const constructorWithFlag = new RegExp("hello", "i");
9const constructorDigits   = new RegExp("\\d+");
  • 리터럴 표기법은 간결하고 읽기 쉬워 상수로 사용되는 정규식에 적합합니다.. 반면에, 생성자 표기법은 변수를 사용하여 패턴을 만들거나 실행 시간에 그 내용을 결정하고자 할 때 사용됩니다.
  • 리터럴 표기법을 사용하면 정규식과 플래그를 직관적으로 함께 작성할 수 있습니다. 반대로, 생성자 표기법에서는 패턴과 플래그를 따로 지정해야 합니다.
  • 또한, 생성자 표기법에서는 정규식을 문자열로 전달하기 때문에 백슬래시를 두 번 이스케이프해야 합니다.

test(): 가장 기본적인 검증

RegExp 객체는 정규식을 사용하여 평가와 작업을 수행할 수 있는 메서드들을 제공합니다. test()는 패턴이 일치하는지 여부를 불리언 값으로 반환하는 메서드입니다.

1const regex = /JavaScript/;
2
3console.log(regex.test("I love JavaScript")); // true
4console.log(regex.test("I love TypeScript")); // false
  • 가장 먼저 배워야 할 메서드이며, 조건 분기나 입력 검증에 알맞습니다.

match(): 매칭 결과 얻기

match()는 일치하는 문자열과 자세한 정보를 담은 배열을 반환합니다.

1const text = "Version 1.2.3";
2const result = text.match(/\d+\.\d+\.\d+/);
3
4console.log(result[0]); // "1.2.3"
  • match()는 추출 및 파싱 과정에서 test()보다 더 편리합니다.

replace(): 정규 표현식을 이용한 치환

replace()는 일치하는 부분을 다른 문자열로 변환합니다.

1const text = "Hello   World";
2const result = text.replace(/\s+/g, " ");
3
4console.log(result); // "Hello World"
  • 로그 포매팅이나 불필요한 공백 정규화 등에 활용할 수 있습니다.

플래그 기본(g, i, m)

정규식에서 '플래그'를 지정할 수 있습니다. 플래그란 정규식이 특정 규칙에 따라 문자열을 처리하는 방식을 제어하는 옵션입니다. 같은 패턴이라도 플래그에 따라 결과가 달라질 수 있습니다.

1const text = "apple Apple APPLE";
2const regex = /apple/gi;        // or new RegExp("apple", "gi");
3
4console.log(text.match(regex)); // ["apple", "Apple", "APPLE"]
  • g (global) 플래그는 문자열 전체를 대상으로 검색합니다.
  • i (ignore case) 플래그는 대소문자를 구분하지 않고 매칭합니다.
1const multilineText = `apple
2banana
3apple`;
4
5const regexM = /^apple/gm;
6
7console.log(multilineText.match(regexM)); // ["apple", "apple"]
  • m (multiline) 플래그는 여러 줄 문자열에서 각 줄을 개별적으로 처리하는 데 사용됩니다. 이 플래그를 사용하면 ^와 $가 문자열 전체가 아닌 각 줄의 시작과 끝에 대응합니다.

문자 클래스: 여러 후보 조합

대괄호 []를 사용하면 한 위치에 올 수 있는 여러 문자를 정의할 수 있습니다.

1const regex = /gr[ae]y/;
2
3console.log(regex.test("gray")); // true
4console.log(regex.test("grey")); // true
  • 이것은 철자 변형이나 간단한 대안을 허용할 때 유용합니다.

메타문자: 자주 쓰이는 축약

메타문자는 자주 사용하는 패턴을 더 짧게 표현할 수 있게 해주는 기호입니다.

1const regex = /\d{4}-\d{2}-\d{2}/;  // or new RegExp("\\d{4}-\\d{2}-\\d{2}");
2
3console.log(regex.test("2025-12-29")); // true
  • \d는 숫자를, {n}은 반복 횟수를 의미합니다.

^와 $: 전체 문자열 검증

^와 $는 문자열의 시작과 끝을 의미합니다.

1const regex = /^\d+$/;
2
3console.log(regex.test("123"));   // true
4console.log(regex.test("123a"));  // false
  • 이들은 폼 입력처럼 정확한 일치가 필요한 상황에서 중요합니다.

그룹화 및 캡처링

괄호 ()를 사용하여 부분 값을 추출할 수 있습니다.

1const text = "2025/12/29";
2const regex = /(\d{4})\/(\d{2})\/(\d{2})/;
3const [, year, month, day] = text.match(regex);
4
5console.log(year, month, day); // 2025 12 29
  • 날짜나 구조화된 문자열을 분해할 때 자주 사용됩니다.

자주 하는 실수 및 주의점

정규 표현식은 강력하지만 읽기 어려워지는 경우가 많습니다.

1// Hard to read
2const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+$/;
  • 너무 복잡해질 경우, 주석 추가, 식 분할, 프로세스 자체 수정 등을 고려해볼 수 있습니다.

요약

RegExp는 자바스크립트에서 문자열 처리를 간단하고 정확하게 표현하기 위한 필수적인 기본 기능입니다. 처음부터 복잡한 정규 표현식을 외울 필요는 없으며, 실제 상황에 맞게 test, match, replace와 같은 기본적인 메서드와 구문을 익히는 것이 중요합니다. 정규 표현식을 '특별한 지식'이 아니라 '체계적인 패턴 표현 도구'로 받아들인다면 입력 검증과 텍스트 처리의 품질과 가독성이 크게 향상될 것입니다.

위의 기사를 보면서 Visual Studio Code를 사용해 우리 유튜브 채널에서 함께 따라할 수 있습니다. 유튜브 채널도 확인해 주세요.

YouTube Video

`Date` 객체