[javascript]정규식(regular expression)

안녕하세요! 개발을 하다 보면 아이디와 비밀번호가 원하는 조건으로 만들어져 있는지, 이메일이 이메일 양식대로 입력되었는지 확인하는 경우가 많은데요, 오늘은 이 때 사용되는 자바스크립트 정규식에 대해 함께 알아봅시다.

 

1. 정규식?

 

MDN web docs는 정규 표현식을 "문자열에서 특정 문자 조합을 찾기 위한 패턴"이라고 설명하고 있습니다. 정규식도 하나의 객체로 RegExp의 exec()와 test() 메소드를 사용할 수 있습니다.  또한 정규식은 문자열에서 쓰이는 패턴이기 때문에 String의 match(),matchAll(),replace(),replaceAll(),search(),split() 메서드도 함께 사용가능합니다. 

 

2.정규식 구조

위에서 정규식은 특정조합을 찾기위한 패턴이라고 설명했습니다. 그렇다면 우리는 어떤 방법으로 이 패턴을 만들 수 있을까요? 이를 위해서는 정규식이 어떤 구조로 이루어져 있는지를 확인해야합니다. 

ex1)  const regex = /abc/i ;

(1) / => 정규식의 시작과 끝 표시.
(2) abc => 특정 문자 조합 패턴 표시.
(3) i => 플래그.    

 

3. 플래그

 

플래그는 일종의 패턴 고급탐색을 위한 옵션입니다. 자바스크립트는 여섯개의 플래그를 제공하며 복수사용이 가능합니다.

i ) 대소문자 구분 없이 검색.

g) 문자열 내 패턴과 일치하는 모든 것들을 찾음.  g 플래그가 없으면 패턴과 일치하는 첫 번째 결과만 반환함.

m) 다중 행 모드(multiline mode) 활성화. 여러줄에서 탐색해야하는 경우 사용.

s)   .  (모든 문자 정규식) 이 개행 문자 \n도 포함하도록 ‘dotall’ 모드를 활성화.

u) 유니코드 전체를 지원

y)  문자 내 특정 위치에서 검색을 진행하는 ‘sticky’ 모드를 활성화. 

 

4. 사용방법

 

정규식에는 두가지 사용 방법이 있습니다. (1) 리터럴 (2) 생성자 . 

중요한 것은 어떤 방식으로 정규식을 생성하여도 내장 클래스 RegExp의 객체가 된다는 점입니다.

주로 리터럴 방식은 이미 어떤 형식으로 패턴을 만들지 알고 있을 때, 생성자 방식은 ‘상황에 따라’ 동적으로 생성된 문자열을 가지고 정규 표현식을 만들어야 할 때 주로 사용됩니다. 

 

(1) const regex = /패턴/플래그; //리터럴
(2) const regex = new RegExp(/패턴/,'플래그'); //리터럴.
(3) const regex = new RegExp('패턴','플래그'); //생성자 

 

4-1) RegExp의 exec()와 test() 메소드.

const regex = /패턴/플래그;
const str = "문자열"; 일때

 

메서드	설명	예
exec()	문자열에서 일치하는 부분을 탐색. 일치 정보를 나타내는 배열, 또는 일치가 없는 경우 null 반환. String 클래스의 match()와 달리, g (global) 플래그가 있어도 일치하는 첫번째 값만 반환.	regex.exec(str);
test()	문자열에 일치하는 부분이 있는지 확인.일치여부에 따라 true 또는 false를 반환.	regex.test(str);

+)

더 자세한 내용은 아래 링크 참고 부탁드립니다.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp

RegExp - JavaScript | MDN

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions

정규 표현식 - JavaScript | MDN

https://ko.javascript.info/regexp-introduction

패턴과 플래그

 

https://www.w3schools.com/jsref/jsref_regexp_exec.asp

JavaScript RegExp exec() Method