FrontEnd/웹 지식

정규표현식

728x90

 

정규표현식을 잘 사용하면 정말 유용하게 문자열들을 걸러낼 수 있다

 

 

🐘 JS에서의 간단한 사용 예

const text = "실행할 텍스트";

console.log(text.match(정규표현식));

 

 

🐘 정규표현식의 기초 문법

 

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

이라는 텍스트를 가지고 실험해보자.

 

 

🐘 문자만 들어온 경우

/시/ : ‘시’를 하나 만 찾는다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ ‘시’ ]

 

 

옵션

 

 

🐘 g

 

/시/g : ‘시’를 모두 찾는다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '시', '시' ]

 

 

/시간/g : ‘시간’를 모두 찾는다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '시간', '시간' ]

 

 

정규표현식 안에 특별한 기호가 없으면 무조건 한 문자 ⇒ 기초단위

그외 옵션에는 아래 경우가 있다

 

/i : 대소문자 구분 안함

/m : 여러 행의 문자열에 대해 검색

 

 

 

🐘 [ ]

/[시달부2]/g : [ ] 안내용중에 하나를 모두 찾는다.

 

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '시', '달', '부', '2', '2', '시' ]

[시달부2] 가 결국 한 문자를 의미한다

 

 

🐘 [ ] 안에서 매칭 패턴

 

a-zA-Z 영어알파벳(-으로 범위 지정)

ㄱ-ㅎ가-힣 한글 문자(-으로 범위 지정)

0-9 숫자(-으로 범위 지정)

. 모든 문자열(숫자, 한글, 영어, 특수기호, 공백 모두! 단, 줄바꿈X)

\\d 숫자

\\D 숫자가 아닌 것

\\w 영어 알파벳, 숫자, 언더스코어(_)

\\W /w 가 아닌 것

\\s space 공백

\\S space 공백이 아닌 것

\\특수기호 특수기호

 

 

🐘0-9

/[0-9]/g : ‘숫자 0-9’를 모두 찾는다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '2', '0', '1', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' ]

🐘 ^

/[^0-9]/g : 숫자 0-9 가 아닌 것을 모두 찾는다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '시', '간', '을', ' ', '달', '리', '는', ' ', '부', '캠', ' ', 'w', 'e', 'e', 'k', '-', ' ', '입', '니', '다', '.', ' ', '연', '락', '은', ' ', '-', '-', ' ', '시', '간', ' ', '이', '내' ]

🐘 |

/시간|부캠/g : Or 기능

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '시간', '부캠', '시간' ]

 

 

/시간 |부캠/g : 정규표현식은 스페이스바도 인지한다!

 

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '부캠', '시간 ' ]

 

 

🐘 $

/이내$/g : $는 문자의 끝을 의미한다.

"시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '이내' ]

 

 

🐘 \b

/\\b[0-9]시간/g : 단어의 처음/끝 , 스페이스바 가 기준이된다.

"0시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내"

[ '0시간', '9시간' ]

 

\\B : 단어의 처음/끝이 아님

 

 

🐘 ?

/abc?d/ : ?앞에는 있을수도 있고 없을수도 있다.

"abc abcd abed abd “

[ 'abcd', 'abd' ]

 

 

/ab[0-9]?d/ : 앞에서 설명한 [] 와 연동할 수 있다.

"abc ab3d abed abd“

[ 'ab3d', 'abd' ]

🐘 +

/[a-z]+/g : a-z 가 연속으로 들어오는경우를 탐지 즉, []안의 문자외의 문자가 올때까지 반복하여 탐지

“abcefg 1234 a1b2c3d4”

[ 'abcefg', 'a', 'b', 'c', 'd' ]

 

 

abcefg ⇒ 스페이스바가 오기전까지 묶는다

/[a-z]+3/g : a-z가 끊길때가지 검사하고 그 이후에 오는 문자가 3이어야 한다.

"abcefg 1234 a1b2c3d4 “

[ 'c3' ]

 

 

🐘 ( )

/시간|부캠을/g : 시간 혹은 부캠을을 감지

"시간을 달리는 부캠을”

[ '시간', '부캠을' ]

 

 

/(시간|부캠)을/g : 시간 혹은 부캠을 감지 한 후, 그 후에 을이 붙어야함

"시간을 달리는 부캠을”

[ '시간을', '부캠을' ]

 

 

🐘 *

/[a-z]*끝/g : +와 유사하지만 []부분이 없어도 된다.

 

"abc끝 dasdf끝 끝”

[ 'abc끝', 'dasdf끝', '끝' ]

 

/[a-z]끝/g : 알파벳 한개 + 끝 조합

"abc끝 dasdf끝 끝”

[ 'c끝', 'f끝' ]

 

 

🐘 {n}

/[a-z]{2}끝/g : +와 유사하고 개수를 직접 정하는 방식이다.

"abc끝 dasdf끝 끝”

[ 'bc끝', 'df끝' ]

 

 

{n,} : 최소 n개 이상

{n,m} : n개이상 m개 이하

**메타 문자** : 원래 그 문자가 가진 의미가 아닌, 특별한 용도로 사용하는 문자

해당문자를 문자자체로 사용하려면 앞에 \를 붙여서 사용한다.

 . ^ $ * + ? { } \\ | ( ) 

🐘 조금 복잡한 마지막 예제

/시작엥?=\\/([a-z]+|7)끝/g

"시작=/abcd끝 시작엥=/끝 시작엥=/asldkfjdslf끝 시작엥=/7끝 시작엥=/777끝”

  • 정답
  • [ '시작=/abcd끝', '시작엥=/asldkfjdslf끝', '시작엥=/7끝' ]
  • 풀이엥 은 있어도 되고 없어도 되고,/ 가 와야하고,끝으로 끝나야 한다
  • 알파벳으로 반복 혹은 숫자 7 이와야하고
  • = 가 와야하고,
  • 시작 으로 시작해야하고,
728x90

'FrontEnd > 웹 지식' 카테고리의 다른 글

HTTP란?  (0) 2022.09.20
Unix와 Windows 파일 시스템  (0) 2022.08.30
자바스크립트 타이머함수  (0) 2022.08.30
스레드와 스케줄링  (0) 2022.08.30
함수형 프로그래밍  (0) 2022.08.30