정규 표현식

정규 표현식. 처음 들었을 때부터 무슨 말인지 몰라 사전부터 찾아봤다. 국어사전엔 역시 없으니 위키백과 찾아봤다.

정규 표현식(正規表現式, 영어: regular expression, 간단히 regexp 또는 regex, rational expression) 또는 정규식(正規式)은 특정한 규칙을 가진 문자열의 집합을 표현하는 데 사용하는 형식 언어이다.

특정한 문자열을 가진 집합. 이게 핵심이었다. 다양한 프로그래밍 언어에서 지원할 정도로 정규 표현식은 그 쓰임이 많다. 프로그래밍은 패턴을 가지고 그룹화하는 게 기본이기 때문이다. 특히 함수형 프로그래밍에서는 더더욱 그룹화는 중요하다. 프론트엔드를 배우는 나로서는 이 정규식을 어디에서 주로 사용하는 지 찾아봤다. 생각외로 많진 않았다. 주로 텍스트 검증단계서 사용했다. 그게 아니면 알고리즘 풀 때... 뿐이었다. 그럼에도 알아두는 것은 항상 옳기 때문에 정리해둔다.

정규식 사용

// 기본 사용 법
/ 조건 /.test("검사하고 싶은 것")

// javascript
const re = /ab+c/

// javascript 메서드 사용 시
const re = new RegExp('ab+c')

// JSX 사용 시. 시작할 때 /^, 끝낼 때 $/
/^ab+c$/

정규식 문법

생각보다 양이 많아, 자주 사용할 것 같은 것만 모았다. 이외의 것들은 '이런 게 없을까' 싶을 때 하나씩 찾아보면서 익히는게 빠를 듯하다. 처음부터 다 외운다고 될 부분이 아닌 듯하다.

문자열	\w
숫자	\d
없거나 한개	?
하나 이상일 때	+
특정개수 지정	{}
또는	,
~ 사이	-
모든	.
원래 가지고 있는 의미 탈피	\

위에 있는 것만으로도 간단한 정규식을 만들 수 있다. 프론트엔드에서 제일 많이 쓰는 이메일 검사도 정규식을 활용하면 좋은 예 중 하나다.

// 정규표현식 예제
console.log(/\w+@\w+.\w+/.test("codecamp@ccc.com")) // true

문자열(\w)이 하나 이상(+)이고, @가 있고, 문자열\w이 하나 이상(+) 이고, .이 있고 문자열(\w)이 하나 이상(+)인가? 아주 간단해졌다.

${/^[a-z0-9\{\}\[\]\/?.,;:|\)*~`!^\-_+<>@\#$%&\\\=\(\'\"]{4,20}$/}

위 코드는 리액트에서 비밀번호에 넣을 수 있는 값을 정해 본 정규식인다. 알파벳 소문자 a~z까지, 숫자는 0~9까지, 그리고 사용가능한 특수문자를 모두 적었다. 그리고 마지막 {4,20}은 최소 4글자, 최대 20자까지 작성할 수 있다는 의미다.

/^01(0|1|[6-9]?)-?([0-9]{3,4})-?([0-9]{4}))$/

이번엔 핸드폰 번호 검증을 정규식으로 표현했다. 시작 숫자가 01이고 이후 0,1,6~9까지 올수 있음을 표현하고 ?를 넣었다. 010의 경우 생략 가능하기 때문이다. 그리고 번호 구분표로 사용하는 -뒤에도 ?를 넣었다. 사용자마다 -를 넣기도하고 빼기도 하니까. 그리고 가운데 번호는 국번에 따라 3자리일수도 있고 4자일 수도 있으니 {3,4}를 집어넣었다. 번호 마지막은 항상 3자리 숫자이니 [0-9]{4}로 표현했다.

마무리

정규식이 아니면 includes나, splice를 썼을 듯하다. 무엇이 더 낫다고 할 수 없으나, 익숙해지면 정규식이 은근히 편하고 빠를 듯하다. 정규식을 아는 사람이라면 코드 독해도 빨라질 듯.

 

위키백과 - 정규 표현식

[MDN] 정규 표현식

※ 잘못된 내용이 있을 경우 댓글로 알려주세요. 배우고 익히고 수정하겠습니다:)