달란트(Talanton)

예전에 웹을 학원에서 배울때 강사가 정규 표현식에 대하여 간단하게 알려 주었고, 회원가입이나 로그인 시 입력 파라미터에 대한 유효성 검증을 할 때 사용했던 것으로 기억한다.

그때는 정확히 모르고 그냥 내가 필요한 것만 적용해서 사용했던 것 같다. 여기서는 이에 대하여 정리를 해보고 여러 가지 사용 예에 대하여 검토를 해 보고자 한다. (참고 : 위키백과 정규 표현식)

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;

}

}

정확한 사용은 조금 더 공부가 필요한 것 같네요...