정규 표현식(Regular Expression)



정규표현식은 문자열에서 특정 내용을 찾거나 대체 또는 발췌하는데 사용한다.

예를 들어 회원가입시 사용자로 부터 입력 받는 전화번호가 유효한지 체크할 필요가 있다면 이때 정규표현식을 사용하면 간단히 처리할 수 있다.

반복문과 조건문을 사용한 복잡한 코드도 정규표현식을 이용하면 매우 간단하게 표현할 수 있다.



정규 표현식 사용 방법

1. 생성자 함수 방식 ( RegExp 생성자 함수 호출 )

const regexp1 = new RegExp("^abc");
// new RegExg(표현식)

const regexp2 = new RegExp("^abc", "gi");
// new RegExg(표현식, 플래그)


2. 리터럴 방식 ( / / 사이에 패턴을 작성 )

const regexp1 = /^abc/;
// /표현식/

const regexp2 = /^abc/gi;
// /표현식/플래그



정규표현식에서 사용되는 메소드

1. exec : 정규식.exec(문자열)
일치하는 하나의 정보(Array) 반환

2. test : 정규식.test(문자열)
일치 여부(Boolean) 반환

3. match : 문자열.match(정규식)
일치하는 문자열의 배열(Array) 반환

4. search : 문자열.search(정규식)
일치하는 문자열의 인덱스(Number) 반환

5. replace : 문자열.replace(정규식,대체문자)
일치하는 문자열을 대체하고 대체된 문자열(String) 반환

6. split : 문자열.split(정규식)
일치하는 문자열을 분할하여 배열(Array)로 반환

7. toString : 생성자_정규식.toString()
생성자 함수 방식의 정규식을 리터럴 방식의 문자열(String)로 반환




Flags (플래그)

플래그는 표현식의 옵션이다. 정규식 패턴에 추가적인 옵션을 넣어 원하는 문자 검색 결과를 반환할 수 있게 해준다.

일반적으로 /^abc/gi; 와 같이 리터럴 바로 뒤에 오거나,

new RegExp("^abc", "gi"); 와 같이 두번째 인자로 온다.



g : 모든 문자와 여러 줄 일치(global)

i : 영어 대소문자를 구분 않고 일치(case insensitive, ignore case)

m : 여러 줄 일치(multiline)

u : 유니코드(unicode)

y : lastIndex 속성으로 지정된 인덱스에서만 1회 일치(sticky)





정규식 패턴

^        : 줄(Line)의 시작에서 일치, /^abc/

$        : 줄(Line)의 끝에서 일치, /xyz$/

.        : 임의의 한 문자와 일치

a|b        : a 또는 b와 일치, 인덱스가 작은 것을 우선 반환

*        : 0회 이상 연속으로 반복되는 문자와 가능한 많이 일치, {0,}와 동일

*?        : 0회 이상 연속으로 반복되는 문자와 가능한 적게 일치(lazy), {0}와 동일

+        : 1회 이상 연속으로 반복되는 문자에 가능한 많이 일치, {1,}와 동일

+?        : 1회 이상 연속으로 반복되는 문자에 가능한 적게 일치(lazy), {1}와 동일

?        : 없거나 1회 가능한 많이 일치

??        : 없거나 1회 가능한 적게 일치(lazy)

{3}        : 3(숫자)개 연속 일치  {n} n번 반복

{3,}        : 3개 이상 연속 일치

{3,5}        : 3개 이상 5개 이하(3~5개) 연속 일치

{3,5}?        : 3개 이상 5개 이하(3~5개) 연속 중 가능한 적은 3개 연속 일치(lazy), {3}와 동일

()        : 캡처(Capture)할 그룹

(?<>)        : 캡처 그룹 이름 지정, /(?<name>pattern)/ ES2018

\1~9        : 정규식 내 캡처된 값 참조, /(abc)\1/

(?:)        : 캡처(Capture)하지 않는 그룹

(?=)        : 앞쪽 일치(Lookahead), /ab(?=c)/

(?!)        : 부정 앞쪽 일치(Negative Lookahead), /ab(?!c)/

(?<=)        : 뒤쪽 일치(Lookbehind), /(?<=ab)c/ ES2018

(?<!)         : 부정 뒤쪽 일치(Negative Lookbehind), /(?<!ab)c/ ES2018

[abc]        : a 또는 b 또는 c와 일치, 점(.)이나 별표(*) 같은 특수 문자는 []안에서 특수 문자가 아님, /\.[.]/

[a-z]        : a부터 z 사이의 문자 구간에 일치(영어 소문자)

[A-Z]        : A부터 Z 사이의 문자 구간에 일치(영어 대문자)

[0-9]        : 0부터 9 사이의 문자 구간에 일치(숫자)

[가-힣]        : 가부터 힣 사이의 문자 구간에 일치(한글)

[2-7]        : 2부터 7 사이의 문자 구간에 일치(2,3,4,5,6,7)

[b-f]        : b부터 f 사이의 문자 구간에 일치(b,c,d,e,f)

[다-바]        : 다부터 바 사이의 문자 구간에 일치(다,라,마,바)

[^abc]        : a 또는 b 또는 c가 아닌 나머지 문자에 일치(부정)

\        : 이스케이프 문자, /\.\?\/\$\^/

\b        : 63개 문자(영문 대소문자 52개 + 숫자 10개 + _(underscore))가 아닌 나머지 문자에 일치하는 경계
(boundary)

\B        : 63개 문자에 일치하는 경계

\d        : 숫자(Digit)에 일치

\D        : 숫자가 아닌 문자에 일치

\p{}        : 유니코드 속성(Property) 집합에 맞는 문자에 일치, /\p{Emoji}/u ES2018

\P{}        : 유니코드 속성 집합에 맞지 않는 문자에 일치, /\p{Uppercase}/u ES2018

\s        : 공백(Space, Tab 등)에 일치

\S        : 공백이 아닌 문자에 일치

\w        : 63개 문자(Word, 영문 대소문자 52개 + 숫자 10개 + _)에 일치

\W        : 63개 문자가 아닌 나머지 문자에 일치

\x        : 16진수 문자에 일치, /\x61/는 a에 일치

\0        : 8진수 문자에 일치, /\141/은 a에 일치

\u        : 유니코드(Unicode) 문자에 일치, /\u0061/는 a에 일치

\c        : 제어(Control) 문자에 일치

\f        : 폼 피드(FF, U+000C) 문자에 일치

\n        : 줄 바꿈(LF, U+000A) 문자에 일치

\r        : 캐리지 리턴(CR, U+000D) 문자에 일치

\t        : 탭 (U+0009) 문자에 일치

$`        : 문자 대체(replace) 시 일치한 문자 이전 값 참조

$'        : 문자 대체(replace) 시 일치한 문자 이후 값 참조

$+        : 문자 대체(replace) 시 마지막으로 캡처된 값 참조

$&        : 문자 대체(replace) 시 일치한 문자 결과 전체 참조

$_        : 문자 대체(replace) 시 입력(input)된 문자 전체 참조

$1~9         :문자 대체(replace) 시 캡처(Capture)된 값 참조



정규표현식은 주석이나 공백을 허용하지 않는다.

es6부터는 정규표현식의 일부를 간단히 대체할 새로운 매서드들이 등장하였는데 

1. str.startsWith()
2. str.endsWith()
3. str.includes()

문자열(string)에 메서드들을 사용하여 시작하는문자, 끝나는문자, 포함되어있는 문자를 찾아 true / false 값을 반환한다.


간단하게 정규 표현식을 연습해 볼 만한 사이트도 있다.

댓글