[1213] 정규 표현식

📚 정규표현식

- 정규 표현식이란?

특정 패턴의 문자열을 찾아주는 표현방식!

내가 찾고자 하는 패턴에 매칭되는 문자열을 찾아준다
정규 표현식과 매서드를 적절히 이용해 문자열을 원하는 형식으로 조작하는 것이 가능하다

 

 

- 예시 

"2021-12-13" 

이라는 문자열은 "4개의 숫자, - ,2개의 숫자, - ,2개의 숫자"로 구성되어 있음.

만약 위와 같은 날짜 형식만 찾아내고 싶다면? 정규 표현식을 이용하면 됨

이걸 정규 표현식으로 하면 /\d{4}-\d{2}-\d{2}/ 라고 함
➡ \d 라고 하는건 숫자임을 의미하고, {} 안에는 그 숫자의 갯수가 들어감

요걸 이용하면

const context = /\d{4}-\d{2}-\d{2}/;

context.test('010-0000-0000') // false
context.test('2022-01-01') // true

이런 식으로 ! 이용이 가능하다.

 

 

💡 정규표현식 사용방법

 

 1. 형식

    /패턴/플래그 

- 슬래시(/) 사이에는 매칭시킬 "패턴"을 써준다.
- 슬래시(/) 다음에는 옵션을 설정하는 "플래그"를 써준다.
  (플래그는 해당하는 처음 하나만 찾을지, 싹 다 찾을지 등을 설정하는 옵션이라고 보면 됨)

 

 

 

2. 패턴 정리 

 

1️⃣ 매칭 패턴

: 문자,숫자,기호등

매칭 패턴	뜻	예시
a-zA-Z	영어 알파벳 (-으로 범위 지정)
ㄱ-ㅎ가-힣	한글 문자 (-으로 범위 지정)
0-9	숫자 (-으로 범위 지정)
.	모든 문자 (숫자,한글,영어,특수기호,공백 모두 단, 줄바꿈x)
\d	숫자
\D	숫자가 아닌거
\w	영어 알파벳, 숫자,언더바(_)
\W	단어 문자가 아닌 문자.	[^A-Za-z0-9_] 와 동일. 예를 들어,  /\W/ 또는 /[^A-Za-z0-9_]/ 는 "50%."의 '%' 랑 같은 의미.
\s	스페이스 (공백)
\S	스페이스(공백)가 아닌 것
|	OR

 

 

 

2️⃣ 검색 패턴

: and, or, StartWith 등등 다양하게 조합 가능

검색패턴	뜻	예시
[문자]	문자셋(Character set)이라고 함. 괄호안의 모든 문자 가리킴	패턴 [a-d] 는 패턴 [abcd] 와 똑같이 동작 "brisket"의 'b' 에 일치. "city"의 'c' 에 일치. 패턴 /[a-z.]+/ 와  /[\w.]+/ 는 "test.i.ng" 전체 문자열이 일치.
[^문자]	괄호안의 문자 제외한 나머지	[^abc] = [^a-c] 같은 의미. "brisket"의 'r', "chop."의 'h' 에 대응됨
^문자열	특정 문자열로 시작(괄호 없음 주의!)
문자열$	특정 문자열로 끝남
( )	그룹 검색 및 분류(match메서드에서 그룹별로 묶어줌)
(?: 패턴)	그룹 검색(분류X)
\b	단어의 처음/끝
\B	단어의 처음/끝이 아님

 

 

 

3️⃣ 갯수(수량) 패턴

: 특정 패턴이 몇번 반복되는지도 필터링 가능

기호	뜻	예시
?	최대 한개 (없거나 한개)	{0,1} 과 같은 의미
*	없거나 있음
+	최소 한개 (한개거나 그 이상)
{n}	n개
{n,}	최소 n개 이상
{n,m}	최소 n개 이상, 최대 m개 이하

 

 

 

4️⃣ 플래그

: 동시에 여러개 사용도 가능 (gi , gm 등)

플래그	뜻	예시
g	모든 문자 검색  (얘 안써주면 매칭되는 첫문자만 검색함)
i	대소문자 구분 안함
m	여러 행의 문자열에 대해 검색

 

 

 

5️⃣ 정규표현식 주요 매서드

: 이 매서드들을 이용해서 매칭되는 문자열을 추출하거나 변환해서

원하는대로 문자열 조작이 가능

매서드	뜻	예시
("문자열").match(/정규식/플래그)	매칭되는 항목을 배열로 반환
("문자열").replace(/정규식/,"대체문자열")	매칭되는 항목을 "대체 문자열"로 변환
("문자열").split(정규식)	매칭되는 항목으로 쪼개서 배열로 반환
(정규식).test("문자열")	"문자열"이 "정규표현식"과 매칭되면 true, 아니면 false반환
(정규식).exec("문자열")	매칭되는 항목의 "무조건 첫번째 결과만" 반환

 

 

 

 

 

 

참고 :

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions#%ED%8A%B9%EC%88%98_%EB%AC%B8%EC%9E%90_%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

정규 표현식 - JavaScript | MDN

https://curryyou.tistory.com/234

[자바스크립트] 정규표현식(Regular Expression) 기초/기본 쉽고 상세한 사용 방법 정리(샘플 예제 코