예전에 웹을 학원에서 배울때 강사가 정규 표현식에 대하여 간단하게 알려 주었고, 회원가입이나 로그인 시 입력 파라미터에 대한 유효성 검증을 할 때 사용했던 것으로 기억한다.
그때는 정확히 모르고 그냥 내가 필요한 것만 적용해서 사용했던 것 같다. 여기서는 이에 대하여 정리를 해보고 여러 가지 사용 예에 대하여 검토를 해 보고자 한다. (참고 : 위키백과 정규 표현식)
1. 정의
정규 표현식 또는 정규식은 특정한 규칙을 가진 문자열의 집합을 표현하는데 사용하는 언어 형식
많은 텍스트 편집기와 프로그래밍 언어에서 문자열의 검색과 치환을 위해 지원
자바스크립트 : 기능 내장
자바 : 표준 라이브러리로 제공
2. 기본 개념
주로 패턴으로 부르는 정규 표현식은 특정 목적을 위해 필요한 문자열 집합을 지정하기 위해 쓰이는 식
- 불린 "또는" : 수직선은 여러 항목 중 선택을 하기 위해 구분
예) gray|grey -> gray 또는 grey와 일치
- 그룹 묶기 : 괄호를 사용하면 연산자의 범위와 우선권을 제어
예) gray|grey와 gr(a|e)y는 'gray'나 'grey' 집합을 둘 다 기술하는 동일 패턴
- 양의 지정
? : 0또는 1차례까지의 발생을 의미
예) colou?r는 'color'와 'colour'를 둘다 일치
* : 0번 이상의 발생을 의미
예) ab*c는 'ac', 'abc', 'abbc', 'abbbc' 등을 일치
+ : 1번 이상의 발생을 의미
예) ab+c는 'abc', 'abbc', 'abbbc' 등을 일치시키지만, 'ac'는 일치시키지 않음
{n} : 정확히 n번만큼 일치시킨다.
{min,} : 'min'번 이상만큼 일치
{min,max} : 적어도 'min'번 만큼 일치시키지만 'max'번을 초과하여 일치시키지는 않는다.
3. 문법
3.1 POSIX 기본 및 확장 표준 문법
- 특수문자(?) :
+ 외부 : 12개 ('.', '[', ']', '^', '$', '(', ')', '\', '*', ',', '{', '}', '-') 13개(?)
+ 내부 : 4개의 문자 ("\", "^", "-", "]") 자바와 닷넷은 "["를 포함
3.2 POSIX 확장 문법
3.3 문자 클래스
4. 예
- email : /^[-A-Za-z0-9_]+[-A-Za-z0-9_.]*[@]{1}[-A-Za-z0-9_]+[-A-Za-z0-9_.]*[.]{1}[A-Za-z]{2,5}$/
+ 처음 문자로 '-' 또는 대문자, 소문자, 숫자, '_' 로 시작 : 1회 이상(+)
+ 그 다음 문자로 '-', 대문자, 소문자, 숫자, '_' 문자가 0번 이상 (*)
+ '@' 문자가 정확히 1번은 일치
+ 그 다음 문자로 '-', 대문자, 소문자, 숫자, '_'가 1회 이상 (+)
+ 그 다음 문자로 '-', 대문자, 소문자, 숫자, '_', '.'가 0번 이상 (*)
+ '.' 문자는 정확히 1번은 일치
+ 마지막으로 문자로 대문자, 소문자가 최소 2번 이상 5번 초과 안되게
- 비밀번호 : /^(?=.*[a-zA-Z])(?=.*[!@#$%^*+=-])(?=.*[0-9]).{7,16}$/
+ 알파벳, 특수문자, 숫자가 최소 7개 이상 최대 16번 미만 입력
+ 특수문자, 영문, 숫자를 한번은 입력하되 8자 이상 16자 미만...
5. JSP 프로젝트 예
5.1 join.jsp (회원가입)
<script type="text/javascript" charset="utf-8" src="../js/member/join.js"></script>
<form action="joinPro.jsp" method="post">
<input type="email" id="id" name="id" placeholder="아이디 입력">
<input type="password" id="pw" name="pw" placeholder="암호 입력">
<input type="submit" value="회원가입">
</form>
5.2 join.js
window.onload = function() {
var id = document.getElementById("id");
id.onkeyup = chkId; // 키보드로 id 값을 입력하면 chkId 함수가 불린다.
var pw = document.getElementById("pw");
pw.onkeyup = chkPw; // 키보드로 password를 입력하면 chkPw 함수가 불린다.
}
var chkId = function() {
var idReg = /^[-A-Za-z0-9_]+[-A-Za-z0-9_.]*[@]{1}[-A-Za-z0-9_]+[-A-Za-z0-9_.]*[.]{1}[A-Za-z]{2,5}$/;
if( !idReg.test(id.value) ) { // 사용자가 입력한 것이 원하는 값이 아니면 'false'로 표시
id.style.color = "#EE5656";
passId = false;
}
else { // 원하는 패턴을 만족하면 'true'로 표시
id.style.color = "blue";
passId = true;
}
}
var chkPd = function() {
var pwReg = /^(?=.*[a-zA-Z])(?=.*[!@#$%^*+=-])(?=.*[0-9]).{7,16}$/;
if( !pwReg.test(pwd.value) ) { // 사용자가 입력한 것이 원하는 패턴이 아니면 'false'로 표시
pwd.style.color = "#EE5656";
passPw1 = false;
}
else { // 원하는 패턴을 만족하면 'true'로 표시
pwd.style.color = "blue";
passPw1 = true;
}
}
정확한 사용은 조금 더 공부가 필요한 것 같네요...
