31장. RegExp(정규 표현식)

모딥다

 

✅ 정규 표현식이란?

---

일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어(formal language)다.

정규 표현식은 자바스크립트의 고유 문법이 아니며, 대부분의 프로그래밍 언어와 코드 에디터에 내장되어 있다.

자바스크립트는 펄(Perl)의 정규 표현식 문법을 ES3부터 도입했다.

 

✅ 정규 표현식의 생성

---

정규 표현식 리터럴

 

✅ RegExp 메서드

---

RegExp.prototype.exec

인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 배열로 반환.

매칭 결과가 없는 경우 null을 반환.

 

exec 메서드는 문자열 내의 모든 패턴을  검색하여 g 플래그를 지정해도 첫 번째 매칭 결과만 반환함

 

RegExp.prototype.test

인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 불리언 값으로 반환.

 

String.prototype.match

대상 문자열과 인수로 전달받은 정규 표현식과의 매칭 결과를 배열로 반환.

g 플래그가 지정되면 모든 매칭 결과를 배열로 반환함

 

✅ 플래그

---

i -> Ignore case -> 대소문자를 구별하지 않고 패턴을 검색

g -> Global -> 대상 문자열 내에서 패턴과 일치하는 모든 문자열을 전역 검색

m -> Multi line -> 문자열의 행이 바뀌더라도 패턴 검색을 계속함

 

✅ 패턴

---

1. 임의의 문자열 검색

.은 임의의 문자 한 개를 의미

const regExp = /.../g;

 

2. 반복 검색

{m,n}은 최소 m번, 최대 n번 반복되는 문자열을 의미

const regExp = /A{1,2}/g;

 

{n}은 {n,n}과 같다. (n번 반복되는 문자열)

{n,}은 최소 n번 이상 반복되는 문자열

 

+는 최소 한 번 이상 반복되는 문자열 즉 {1, }과 같다.

const regExp = /A+/g;

 

?는 최대 한 번(0번 포함) 이상 반복되는 문자열을 의미. 즉 {0,1}과 같다. (optional의 의미)

const regExp = /colou?r/g;

(u는 있어도 되고 없어도 됨)

 

3. OR 검색

|은 or의 의미를 갖는다.

const regExp = /A|B/g;

 

분해되지 않은 단어 레벨로 검색하기 위해서는 +를 함께 사용

const regExp = /A+|B+/g;

 

[]를 사용하여 간단히 표현할 수 있다. [] 내의 문자는 or로 동작한다. 그 뒤에 +를 상요하면 앞선 패턴ㅇ르 한 번 이상 반복한다.

const regExp = /[AB]+/g;

 

범위를 지정하려면 []내에 -를 사용한다.

const regExp = /[A-Z]+/g;

 

/d는 [0-9]와 같다. /D는 /d와 반대로 동작한다. 즉 /D는 숫자가 아닌 문자를 의미한다.

 

/w는 알파벳, 숫자, 언더스코어를 의미한다. 즉 [A-Za-z0-9_]와 같다. /W는 /w와 반대로 동작한다.

즉 /W는 알파벳, 숫자, 언더스코어가 아닌 문자를 의미한다.

 

4. NOT 검색

[...] 내의 ^은 not의 의미를 갖는다.

 

5. 시작 위치로 검색

[...] 밖의 ^은 문자열의 시작을 의미한다.

 

6. 마지막 위치로 검색

$는 문자열의 마지막을 의미한다.

 

✅ 자주 사용하는 정규 표현식

---

특정 단어로 시작하는지 검사

/^https?:\/\//.test(url);

 

특정 단어로 끝나는지 검사

/html$/.test(fileName);

 

숫자로만 이루어진 문자열인지 검사

/^/d+$/.test(target);

 

하나 이상의 공백으로 시작하는지 검사

/^[/s]+/.test(target);

 

아이디로 사용 가능한지 검사

/^[A-Za-z0-9]{4,10}$/.test(id);

 

메일 주소 형식에 맞는지 검사

/^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$\.test(email);

 

핸드폰 번호 형식에 맞는지 검사

/^\d{3}-\d{3,4}-\d{4}$/.test(cellphone);

 

특수 문자 포함 여부 검사

(/[^A-Za-z0-9]/gi).test(target);

 

특수 문자를 제거할 때는 String.prototype.replace 메서드를 사용한다.

target.replace(/[^A-Za-z0-9]/gi, '');