웹만들기의 기초가 되는 로그인, 회원가입에 기본적으로 사용되는 input
input에 넣을 수 있는 다양한 속성중에 pattern을 이용하여 사용자가 입력할 수 있는 값을 제어할 수가 있다.
이걸 유효성 검사라고 보통 칭하며 입력한 값이 유효한 값인지 체크하는 것이다.
pattern을 제어할 때 정규표현식을 사용하며 정규표현식에 대해 알아보자.
[ 정규표현식(正規表現式, Regular Expression)은 문자열을 처리하는 방법 중의 하나로 특정한 조건의 문자를 '검색'하거나 '추출', '치환'하는 과정을 매우 간편하게 처리 할 수 있도록 하는 수단 ]
1. 콤마( . )
: 어떤 문자 1개를 가리킨다. (줄바꿈문자(\n) 제외)
2. 대괄호[ ]
: [ ] 안에 있는 문자 중 하나를 가리킨다.
[abc] a,b,c중에 하나
[a-z] 알파벳 소문자 중에 하나
[0-9] 숫자 중에 하나 (= ₩d )
[a-zA-Z] 알파벳 소문자, 대문자 중에 하나
3. 대괄호와 캐럿 [ ^ ]
: [ ^ ] 안에 있는 문자를 제외한 하나를 가리킨다.
4. 별표( * )
: 별표 앞에 있는 문자가 반복되는 것을 가리킨다.( 0번 반복도 가능)
5. 플러스 ( + )
: 플러스 앞에 있는 문자가 반복되는 것을 가리킨다.( 0번 반복 불가능)
6. 물음표 ( ? )
: 물음표 앞에 있는 문자가 0번 또는 1번 반복되는 것을 가리킨다.
7. {n}
: 앞에 있는 문자가 n번 반복되는 것을 가리킨다.
8. {n,}
: 앞에 있는 문자가 n번 이상 반복되는 것을 가리킨다.
9. {n,m}
: 앞에 있는 문자가 n번 이상, m번 이하 반복되는 것을 가리킨다.
10. 캐럿( ^ )
: 줄의 시작 위치를 가리킨다.
11. 달러( $ )
: 줄의 마지막 위치를 가리킨다.
12. 그룹 ( )
: 특정 패턴 묶기 (주로 반복 기호와 같이 사용)
13. 선택지정 ( | )
: ()에 묶인 특정 패턴 중에 | 으로 나눈 것 중에 하나를 가리킨다.
14. ( )\숫자
: 그룹으로 지정된 내용을 뒤에 '\숫자' 형식으로 재 사용
15. /
: 정규표현식 패턴의 시작과 끝을 나타냄
16. ₩.
: . 을 표현
17. /u
: 유니코드 모드를 나타내는 플래그
18. (?= ... )
: 괄호 안에 있는 표현이 해당 위치에서 최소한 하나 이상 존재
19. 탐욕적 수량자(Greedy), 게으른 수량자(Lazy)
- 탐욕적 수량자의 핵심은 조건에 맞지 않을 때까지 하나의 패턴으로 인식하는 것이고
- 게으른 수량자의 핵심은 조건에 맞으면 욕심부리지 말고 거기서 끝내는 것이다.
Greedy | Lazy |
* | *? |
+ | +? |
? | ?? |
{n} | {n}? |
{n,} | {n,}? |
{n,m} | {n,m}? |
<기본적인 정규식>
정규표현식 | 설명 |
^abc | abc로 시작하는 것 |
abc& | abc로 끝나는 것 |
^[0-9] | 숫자 0~9 중 하나로 시작하는 패턴 |
[^0-9] | 숫자가 들어있지 않는 패턴 |
^[^0-9] | 숫자가 들어있지 않은 문자로 시작하는 패턴 |
a{3} | aaa |
a{3,] | a가 3번 이상 반복인 것 |
[0-9]{2} | 두 자리 숫자 |
abc[7-9]{2} | abc를 포함하고 7~9까지 숫자 중 2자리가 포함하는 것 |
<대표적으로 많이 사용하는 정규식>
패턴 설명 | 정규표현식 |
이메일 | "/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+₩.[a-zA-Z]{2,4}$/" |
집전화번호 | "/^(070|02|031|032|033|041|042|043|051|052|053|054|055|061|062|063|064)-₩d{3,4}-₩d{4}$/u" |
휴대폰 번호 | "/^(010|011|016|017|018|019)-₩d{3,4}-₩d{4}$/u" |
우편번호 | "/^₩d{3}-?₩d{3}$/u" |
아이디 | "/^[a-zA-Z]₩d{2,7}$/u" |
주민등록번호 | "/^₩d{2}[0-1]₩d[0-3]₩d-?[1-6]₩d{6}$/u" |
비밀번호 | " ^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@#$!%*?&])[A-Za-z\d@#$!%*?&]{8,}$ " |
참고한 블로그
[정규표현식] 정규표현식 정리, 정규식 : 네이버 블로그 (naver.com)
[ 스크랩 ] Regular Expression( 정규표현식 ) 총정리 : 네이버 블로그 (naver.com)
[정규표현식] 정규표현식 정리, 정규식
[정규표현식] 정규표현식 정리 정규표현식(正規表現式, Regular Expression)은 문자열을 처리하는...
blog.naver.com