[ JS ] - RegExp 자바스크립트 정규식표현 총 정리. Pattern별 의미를 알아보자~!!

 

Javascript Regular Expression 

( 자바스크립트 정규식 표현 )

 

Syntax

/pattern/flag

 

 

Default variables

const str = 'Good morning, Morning coffee is goood coffee, too';

str 에 string data를 위와같이 넣고 아래의 pattern별 결과를 확인해보자

 

아래 명령어를 콘솔에 찍어보자

str.match(pattern); -> pattern자리에 아래의 표의 표현을 넣어보고 결과를 정리해 보았다.

/Pattern/flag 표 정리

구분	pattern	result	description
기본문자열 검색	/good/gi	['Good' ]	good 문자열과 매칭되는 문자열
임의문자 검색	/.../g	['Goo','d m','orn'... ]	3자리씩 문자를 끊어 출력한다.공백포함 '.'하나당 문자 하나
반복 검색	/o{1,2}/g	['oo','o','o','o','oo','o','o','oo']	'o'문자열이 최소 한번 최대 2번 반복되는 문자열
	/o{2}/g	['oo','oo','oo']	'o'문자열이 2번 반복되는 문자열
	/o{2,}/g	['oo','ooo','oo']	'o'문자열이 2번이상 반복되는 문자열
	/o+/g	['oo','o','o','o','ooo','o','oo']	'o'문자열이 최소 1번이상 반복되는 문자열
	/ooo?d/g	['ood', 'oood']	'o'문자열이 최대한번(0번포함)이상 반복되는 문자열이며 ?는 {0,1}과 같다고 보면 된다.
OR 검색	/oo|ff/g	[ 'oo', 'ff', 'oo', 'ff', 'oo' ]	'|' 가 or를 의미하며, 'oo' 또는 'ff' 문자열
	/[of]/g		'o'또는 'f'가 한번이상 반복되는 문자열
	/[a-z]+/g		a~z 까지의 소문자 영문이 한번이상 반복되는 문자열
	/[A-Za-z]+/g		대소문자 a~z까지의 영문 검색
	/[0-9A]+/g		'0' 부터 '9'가 한번이상 반복되는 문자열과 'A'가 한번이상 반복되는 문자열
	/[\d]+/g		/[0-9]+/ 와 동일하게 숫자만 탐색
	/[\D]+/g		숫자가 아닌 문자열만 탐색
	/[\w]+/g	/[A-Za-z0-9_]+/g 와 동일	대소문자 알파벳, 숫자, 언더하이픈 문자열
	/[\W]+/g	\w와 반대	대소문자 알파벳,숫자,언더하이픈이 아닌 문자열
NOT 검색	/[^[0-9]+/g	[...] 내부에 있을 때	숫자를 제외한 문자열
시작위치 검색	/^G/	['G']	'G'로 시작하는 문자열
끝위치 검색	/o$/	['o']	'o'로 끝나는 문자열

 

 

정규식 표현예제

검색목적	pattern	description
특정단어로 시작	/^https?:\/\//.test(str)	'http://' 또는 'https://'로 시작하는지 검사
특정단어로 끝남	/jpg$/.test(str)	'jpg'로 끝나는지 검사
숫자인지 검사	/^\d+$/.test(str)	숫자로 시작하고 숫자
공백 검사	/^[\s]+/.test(str)	하나이상의 공백으로 시작하는지 검사
입력값 제한 검사	/^[A-Za-z0-9]{6,12}$/.test(str)	영문 대소문자와 숫자로시작하고 끝나며 6~12자리인지 검사
휴대폰번호 형식	/^\d{3}-\d{3,4}-\d{4}$/.test(str)	숫자3자리-숫자3또는4자리-숫자4자리 숫자로 시작하며 끝나는지 검사
특수문자검사	(/[^A-Za-z0-9]/gi).test(str)	영문대소문자,숫자가아닌 문자가 있는지 검사

  

Reference Site

- 정규표현식을 연습해 볼 수 있는 사이트

https://regexr.com/

RegExr: Learn, Build, & Test RegEx

 

 이 정규식을 html input 태그에 pattern 속성으로 넣어서 사용하는 법을 정리해 놓은 링크

[HTML] input 패턴 정규표현식. html 입력필드에 들어가는 값에 대한 표현식 정하기. RegExp in javascript