정규표현식(Regular Expression)

정규식

• 문자열에서 특정 내용을 찾거나 대체 또는 발췌할 때 사용

정규식이 유용하게 사용되는 경우

1. 각각 다른 포맷으로 저정된 많은 전화번호 데이터를 추출해야 할 때
2. 사용자가 입력한 이메일, 휴대폰 번호 등이 올바른지 검증하고 싶을 때
3. 코드에서 특정 변수 이름을 치환하고 싶지만, 해당 변수의 이름을 포함하는 함수는 제외하고 싶을 때
4. 특정 조건과 위치에 따라서 문자열에 포함된 공백이나 특수문자를 제거하고 싶을 때
   
   

정규식 구성

출처: https://poiemaweb.com/js-regexp

//리터럴 방식
const regex = /abc/;

//생성자 방식
const regex = new RegExp("abc");
const regex = new RegExp(/abc/);

정규식 메소드

메서드	의미
문자열.match(/정규표현식/플래그)	문자열에서 정규표현식에 매칭되는 항목들을 배열로 반환
문자열.replace(/정규표현식/,"대체문자열")	정규표현식에 매칭되는 항목을 대체문자열로 반환
문자열.split(정규표현식)	문자열을 정규표현식에 매칭되는 항목으로 쪼개어 배열로 반환
정규표현식.test(문자열)	문자열이 정규표현식과 매칭되면 true, 아니면 false
정규표현식.exec(문자열)	match와 비슷하나 매칭되는 첫번째 결과만 반환

예제

const regex = /hi/;

regex.test("hi my name is miyaongg"); //true

const text = "hi my name is miyaongg";
text.match(regex); //["hi"]

text.replace(regex, "hello"); //"hello my name is miyaongg"

정규식 플래그

플래그	의미	설명
i	Ignore Case	대소문자를 구별하지 않고 검색
g	Global	문자열 내의 모든 패턴을 검색
m	Multi Line	문자열의 행이 바뀌더라도 계속 검색
s		모든 문자 정규식이 개행 문자도 포함하도록
u	Unicode	유니코드 전체 지원
y	Sticky	문자 내 특정 위치에서 검색을 하는 'sticky' 모드 활성화

i

• 대소문자 구분 x

const text = "miyaAongg";
text.match(/a/gi); //["a", "A"]

g

• g 플래그가 없는 경우에는 최초 검색 결과 하나만을 반환하지만,
  g 플래그가 있는 경우에는 모든 검색 결과를 배열로 반환

const text = "miyaongg";
text.match(/g/); //["g", index: 6, input: "miyaongg", groups: undefined]
text.match(/g/g); //["g", "g"]

m

• 여러 줄의 문자열에서 필터링 해야 할 때 사용

const text = "Hello miyaongg\nHi miyaongg?\nHi Lalala" 
text.match(/^miyaongg/); //["miyaongg"]
text.match(/^Hi/); //null - 다음 줄 검색 안됨
text.match(/^Hi/m); //["Hi"]
text.match(/^Hi/gm); //["Hi", "Hi"] - g 플래그와 혼합하면 그 다음 줄도 검색 가능

정규식 기호

패턴	의미
a-zA-Z	영어 알파벳
ㄱ-ㅎ가-힣	한글 문자
0-9	숫자
.	모든 문자열(숫자, 한글, 영어, 특수기호, 공백), 줄바꿈 X
\d	숫자
\D	숫자가 아닌 문자
\w	63개 문자(Word, 영어 대소문자 52개 + 숫자 10개 + _)
\W	63개 문자가 아닌 나머지 문자
\s	공백(Space, Tab 등)
\S	공백이 아닌 문자
\특수문자	*, \^, \&,!, \?, \/ 등
\b	63개 문자가 아닌 나머지 문자에 일치하는 경계(boundary)
\B	63개 문자에 일치하는 경계
\x	16진수 문자에 일치 /\x61/은 a에 일치
\0	8진수 문자에 일치 /\141/은 a에 일치
\u	유니코드 문자에 일지 /\u0061/은 a에 일치
\c	제어(Control) 문자에 일치
\f	폼 피드(FF, U+000C) 문자에 일치
\n	줄 바꿈 문자에 일치
\r	캐리지 리턴(CR, U+000D) 문자에 일치
\t	탭 문자에 일치
$`	문자 대체(replace) 시 일치한 문자 이전 값 참조
$'	문자 대체(replace) 시 일치한 문자 이후 값 참조
$+	문자 대체(replace) 시 마지막으로 캡처된 값 참조
$&	문자 대체(replace) 시 일치한 문자 결과 전체 참조
$_	문자 대체(replace) 시 입력(input)된 문자 전체 참조
$1~9	문자 대체(replace) 시 캡처(Capture)된 값 참조

정규식 검색 기준 패턴

기호	의미
[]	괄호 안의 문자들 중 하나(or 처리 묶음)
[^문자]	괄호 안의 문자를 제외한 것
^문자열	특정 문자열로 시작(시작점)
문자열$	특정 문자열로 끝남(종착점)

정규식 갯수 반복 패턴

기호	의미
?	없거나 1회 가능한 많이 일치
*	0회 이상 연속으로 반복되는 문자와 가능한 많이 일치
+	1회 이상 연속으로 반복되는 문자에 가능한 많이 일치
*?	0회 이상 연속으로 반복되는 문자와 가능한 적게 일치(lazy)
+?	1회 이상 연속으로 반복되는 문자에 가능한 적게 일치(lazy)
{n}	n(숫자)개 연속 일치
{Min,}	Min개 이상 연속 일치
{Min, Max}	Min개 이상 Max개 이하(3~5개) 연속 일치

정규식 그룹 패턴

기호	의미
()	그룹화 및 캡쳐
(?:패턴)	그룹화 (캡쳐X)
(?=)	앞쪽 일치 /ab(?=c)/
(?!)	부정 앞쪽 일치 /ab(?!c)/
(?<=)	뒤쪽 일치 /(?<=ab)c/
(?<!)	부정 뒤쪽 일치 /(?<!ab)c/

정규식 그룹화?

"hahahaha".match(/ha+/); //"ha"
"haaaahaaaa".match(/ha+/); //"haaaa"
//ha+는 "a"에만 +를 적용시켜 "haaaa"가 반환됨

"hahahaha".match(/(ha)+/); //"hahahaha", "ha"
"haaaahaaaa".match(/(ha)+/); //"ha", "ha"
//(ha)+는 "h"와"a"를 그룹화해서 "ha" 자체를 1회 이상 연속으로 반복되는 문자로 검색

정규식 캡처

() 패턴을 사용한 정규식을 보면 g 플래그를 사용하지 않았는데도 결과가 2개씩 나오는 걸 볼 수 있다.

왜?

=> () 패턴은 괄호 안에 있는 표현식을 캡처하여 사용

"123abc".match(/(\d+)(\w)/); //"123a", "123", "a"
/*
	1. () 패턴 안의 표현식을 순서대로 캡처한다. \d+, \w
    2. 표현식으로 검색한다
    	=> (\d+): 1개 이상 연속되는 숫자 검색 = 123
        (\w): 문자 검색 = a
        = "123a"
    3. 첫 번째 캡처한 표현식 (\d+)로 재검색 = "123"
    4. 두 번째 캡처한 표현식 (\w)로 재검색 = "a"
*/

필요한 결과만 얻고 싶다면?

=> 캡처하지 않는 그룹화 (?:) 사용

"hahahaha".match(/(ha)+/); //"hahahaha", "ha"
"hahahaha".match(/(?:ha)+/); //"hahahaha"

정규식은 항상 검색해서 사용했는데
조금이라도 복잡해지면 이해하기 어렵고, 꽤 자주 사용해왔는데 쓸 때마다 검색하기 보다는 이해하고 사용하는 게 좋을 것 같아 이번 기회에 찾아보고 정리하게 되었다.




출처: https://inpa.tistory.com/entry/JS-%F0%9F%93%9A-%EC%A0%95%EA%B7%9C%EC%8B%9D-RegExp-%EB%88%84%EA%B5%AC%EB%82%98-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0-%EC%89%BD%EA%B2%8C-%EC%A0%95%EB%A6%AC