JavaScript 중급 문법

JavaScript 정규 표현식

JavaScript 정규 표현식 — 중급

정규 표현식

1. 도입 (왜 배워야 하는가)

정규 표현식(Regular Expressions, 줄여서 RegEx)은 문자열에서 특정 패턴을 찾고 조작하는 데 매우 유용한 도구입니다. 웹 개발, 데이터 처리, 입력 검증 등 다양한 실무 환경에서 정규 표현식을 사용하여 효율적으로 작업할 수 있습니다. 예를 들어, 사용자가 입력한 이메일 주소가 유효한지 확인하거나, 대량의 텍스트에서 특정 단어를 찾는 작업에 활용됩니다.

정규 표현식을 모르면 이런 작업을 수작업으로 처리해야 하며, 이는 시간과 노력을 크게 소모합니다. 예를 들어, 입력 검증을 수작업으로 구현할 경우 개발자가 실수를 할 가능성이 높고, 코드의 유지보수성도 떨어집니다. 따라서 정규 표현식을 배우는 것은 프로그래밍 능력을 크게 향상시킬 수 있습니다.

2. 핵심 개념 설명

정규 표현식은 문자열을 검색하고 변경하기 위한 강력한 도구입니다. 이 도구는 다음과 같은 기본 개념으로 구성됩니다.

문자 클래스: 특정 문자 집합을 나타냅니다. 예를 들어, [abc]는 'a', 'b', 'c' 중 하나의 문자와 일치합니다.
수량자: 반복 횟수를 지정합니다. *는 0회 이상, +는 1회 이상, ?는 0회 또는 1회 출현을 의미합니다.
경계: 문자열의 시작(^) 또는 끝($)을 나타냅니다.
이스케이프 문자: 특수 문자를 일반 문자로 처리하기 위해 \를 사용합니다. 예를 들어, \.는 마침표(.)를 나타냅니다.

용어	설명
문자 클래스	특정 문자 집합을 의미
수량자	반복 횟수를 지정
경계	문자열의 시작 및 끝을 표시
이스케이프	특수 문자를 일반 문자로 변환

3. 기본 코드 예제

가장 기본적인 정규 표현식의 사용 예제를 살펴보겠습니다. 이 예제에서는 문자열에서 숫자를 찾는 방법을 보여줍니다.

const str = "제 전화번호는 010-1234-5678입니다.";
const regex = /\d+/g; // \d는 숫자를 의미, +는 1회 이상, g는 전역 검색

const result = str.match(regex); // 문자열에서 정규 표현식에 맞는 부분을 찾음
console.log(result); // [ '010', '1234', '5678' ]

const str = "제 전화번호는 010-1234-5678입니다."; : 검색할 문자열을 변수 str에 저장합니다.
const regex = /\d+/g; : 숫자를 찾기 위한 정규 표현식을 정의합니다. \d는 숫자를 의미하고 +는 1회 이상 출현할 수 있음을 나타냅니다.
const result = str.match(regex); : match 메서드를 사용하여 문자열에서 정규 표현식에 맞는 부분을 검색합니다.
console.log(result); : 찾은 결과를 콘솔에 출력합니다.

4. 실전 활용 예제

1. 이메일 주소 검증

쇼핑몰에서 회원가입 시 입력된 이메일 주소가 유효한지 확인할 때 정규 표현식을 사용할 수 있습니다.

function validateEmail(email) {
    const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; // 이메일 형식 정규 표현식
    return regex.test(email); // 유효하면 true 반환
}

console.log(validateEmail("[email protected]")); // true
console.log(validateEmail("invalid-email")); // false

2. 전화번호 형식 체크

고객의 전화번호가 올바른 형식인지 확인하는 데 사용됩니다.

function validatePhoneNumber(phone) {
    const regex = /^\d{3}-\d{4}-\d{4}$/; // "000-0000-0000" 형식
    return regex.test(phone); // 유효하면 true 반환
}

console.log(validatePhoneNumber("010-1234-5678")); // true
console.log(validatePhoneNumber("12345")); // false

5. 흔한 실수와 주의사항

실수 1: 이스케이프 문자 누락

잘못된 코드:

const regex = /[.]/; // '.'은 모든 문자를 의미

올바른 코드:

const regex = /\./; // '.'을 문자로 인식

실수 2: 수량자 사용 실수

잘못된 코드:

const regex = /\d*/; // 0회 이상을 의미

올바른 코드:

const regex = /\d+/; // 1회 이상을 의미

6. 정리

정규 표현식은 문자열 검색 및 조작에 유용한 도구입니다.
문자 클래스, 수량자, 경계, 이스케이프 문자를 이해해야 합니다.
이메일 주소와 전화번호 형식 검증에서 자주 사용됩니다.
이스케이프 문자를 적절히 사용해야 하며, 수량자 사용에 주의해야 합니다.

다음에 학습하면 좋은 주제는 자바스크립트의 문자열 메서드입니다. 이 메서드들은 정규 표현식과 함께 사용될 수 있어 문자열 처리의 폭을 넓혀줄 것입니다.