[JS] 자바스크립트 정규식 가이드

[JS] 자바스크립트 정규식 가이드

자바스크립트 정규식 가이드 🔍

1. 정규식이란 무엇인가? 🤔

  • *정규식(Regular Expression)**은 문자열에서 특정한 패턴을 찾기 위한 도구이다. 주로 문자열 검색, 텍스트 매칭, 데이터 검증 등에 많이 사용된다. 예를 들어, 이메일 주소가 올바른 형식인지 확인하거나, 문자열에서 특정 단어를 찾아 바꾸고자 할 때 정규식을 사용한다.

자바스크립트에서는 정규식을 두 가지 방법으로 작성할 수 있다:

  1. 리터럴 표기법/패턴/플래그
  2. RegExp 객체 생성자new RegExp('패턴', '플래그')

예를 들어:


// 리터럴 표기법
const regex1 = /hello/;

// RegExp 객체 생성자
const regex2 = new RegExp('hello');

리터럴 표기법은 코드를 작성할 때 직접 패턴을 정의하는 방법이고, RegExp 객체는 문자열로 패턴을 만들어야 할 때 유용하다. 일반적으로 리터럴 표기법이 더 직관적이어서 많이 사용된다.

이제 정규식의 주요 구성 요소와 기본적인 사용법을 하나씩 살펴보자


2. 정규식의 주요 패턴과 기호 📝

정규식에는 다양한 특수 기호와 패턴을 이용해 복잡한 문자열 매칭을 할 수 있다. 가장 많이 사용되는 기호들을 나열해본다.

  1. 문자 클래스
  2. 반복 패턴
  3. 위치 표시자
  4. 선택과 그룹화

(): 그룹을 지정하는 데 사용한다.

const regex = /(ha)+/;
console.log(regex.test("hahaha"));  // true ('ha'가 반복됨)

|: OR 조건을 의미한다.

const regex = /cat|dog/;
console.log(regex.test("I have a cat"));  // true
console.log(regex.test("I have a dog"));  // true

$: 문자열의 끝을 의미한다.

const regex = /world$/;
console.log(regex.test("hello world"));  // true (문자열이 'world'로 끝남)

^: 문자열의 시작을 의미한다.

const regex = /^hello/;
console.log(regex.test("hello world"));  // true (문자열이 'hello'로 시작)

{n,m}: n번 이상, m번 이하 반복을 의미한다.

const regex = /a{2,4}/;
console.log(regex.test("aaa"));  // true (a가 2번 이상 4번 이하 반복됨)

?: 0회 또는 1회를 의미한다.

const regex = /ab?/;
console.log(regex.test("a"));  // true (b가 없어도 됨)
console.log(regex.test("ab"));  // true

+: 1회 이상 반복을 의미한다.

const regex = /ab+/;
console.log(regex.test("a"));  // false (b가 최소 1번은 나와야 함)
console.log(regex.test("abbb"));  // true

*: 0회 이상 반복을 의미한다.

const regex = /ab*/;
console.log(regex.test("a"));  // true (b가 0번 이상 나올 수 있음)
console.log(regex.test("abbb"));  // true

\s: 공백 문자를 의미한다. (스페이스, 탭 등)

const regex = /hello\sworld/;
console.log(regex.test("hello world"));  // true (공백이 있는 경우 매칭)

\w: 알파벳 대소문자, 숫자, 언더스코어(_)를 의미한다. ([a-zA-Z0-9_]와 동일)

const regex = /\w+/;
console.log(regex.test("hello_world"));  // true

\d: 숫자를 의미한다. ([0-9]와 동일)

const regex = /\d+/;
console.log(regex.test("123abc"));  // true (숫자가 하나 이상 포함된 경우)

.: 모든 단일 문자를 의미한다.

const regex = /h.llo/;
console.log(regex.test("hello"));  // true (h로 시작하고 o로 끝나는 문자 매칭)

3. 정규식 플래그 🔖

플래그는 정규식의 동작 방식을 제어하는 추가 옵션이다. 다음은 자주 사용되는 플래그들이다:

  • g (global): 전체 문자열에서 패턴을 모두 찾는다.
  • i (ignore case): 대소문자를 구분하지 않고 찾는다.
  • m (multiline): 여러 줄에서 각 줄의 시작과 끝을 고려한다.

예를 들어:


const regex = /hello/gi; // 'hello'를 대소문자 구분 없이 전체에서 찾음.

4. 정규식의 주요 메서드들 📚

  1. exec() 메서드: 정규식과 일치하는 부분을 찾고, 그 결과를 배열로 반환한다.

test() 메서드: 문자열에 정규식과 일치하는 부분이 있는지 검사하여 true 또는 false를 반환한다.

const regex = /hello/;
const str = "hello world";

console.log(regex.test(str));  // true (문자열에 'hello'가 존재함)
javascript
코드 복사
const regex = /world/;
const result = regex.exec('Hello world');
console.log(result[0]); // 'world'

  1. 문자열 메서드와 함께 사용

replace(): 정규식과 일치하는 부분을 다른 문자열로 대체한다.


const str = 'My dog is cute.';
const newStr = str.replace(/dog/, 'cat');
console.log(newStr); // 'My cat is cute.'

match(): 정규식과 일치하는 부분을 배열로 반환한다.


const str = 'NO PAIN no gain';
const result = str.match(/ain/gi);
console.log(result); // ['AIN', 'ain']

5. 정규식의 실제 사용 예시 ✨

정규식을 실무에서 어떻게 사용할 수 있는지 알아보자.

실무에서 사용 예제 🖥️

// 전화번호를 뽑기 위한 정규식
const regex = /\+CNUM: ".*","(\+\d+)",\d+/;
const match = response.match(regex);

if (match) {
    const phoneNumber = match[1];
    logger.info(`[checkTX700Status] Device Phone Number: ${phoneNumber}`);
}
if (response.includes('OK')) {
     ogger.info(`[checkTX700Status] Status: OK`);
}

URL 형식 검증 🌐

const urlRegex = /^(https?:\/\/)?(www\.)?[a-zA-Z0-9-]+(\.[a-zA-Z]{2,})+(:\d+)?(\/.*)?$/;
console.log(urlRegex.test("https://www.example.com"));  // true
console.log(urlRegex.test("ftp://example.com"));        // false

전화번호 형식 검증 📞

const phoneRegex = /^\d{3}-\d{3,4}-\d{4}$/;
console.log(phoneRegex.test("010-1234-5678"));  // true
console.log(phoneRegex.test("02-123-5678"));    // true
console.log(phoneRegex.test("12345678"));       // false

이메일 주소 검증 📧

const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
console.log(emailRegex.test("test@example.com"));  // true
console.log(emailRegex.test("invalid-email"));     // false

6. 정규식의 장점과 단점 ⚖️

📌 장점:

  • 강력한 문자열 검색 및 대체 기능: 정규식을 사용하면 복잡한 문자열 검색 및 변환을 쉽게 처리할 수 있다.
  • 짧고 간결한 코드: 긴 문자열 처리를 한 줄의 정규식으로 해결할 수 있다.

📌 단점:

  • 가독성: 정규식은 익숙하지 않으면 이해하기 어렵고, 복잡한 정규식은 쉽게 가독성이 떨어질 수 있다.
  • 유지보수의 어려움: 시간이 지나면 정규식을 분석하고 수정하는 것이 어려울 수 있다.

7. 정규식을 사용할 때 주의사항 ⚠️

  • 너무 복잡한 정규식은 이해하고 유지보수하기 어려울 수 있으므로 가능한 간단하게 유지하는 것이 좋다.
  • 항상 테스트 데이터를 통해 정규식이 의도한 대로 동작하는지 확인해야 한다. 정규식을 테스트하는 여러 도구들이 있으니, 이를 활용해볼 수 있다. 예를 들어, Regex101 같은 사이트를 이용하면 매우 유용하다.

8. 정리 📚

정규식은 문자열에서 특정 패턴을 찾거나 수정하는 데 매우 유용한 도구이다. 자바스크립트에서 정규식을 사용하는 것은 처음에는 어려울 수 있지만, 다양한 활용 사례와 예제를 통해 반복 학습하면 쉽게 익숙해질 수 있다. 이메일 형식 검증, 전화번호 확인, 특정 문자열 패턴 찾기 등 다양한 작업에서 정규식의 강력함을 느껴볼 수 있을 것이다.

댓글