Javascript(jQuery) 정규식

참고 사이트

---

1. 총 정리 : http://www.nextree.co.kr/p4327/

2. 정규식 예제 :

  > https://coding-factory.tistory.com/196

  > https://develop88.tistory.com/

3. 정규식 함수 : https://tonks.tistory.com/20

 

jQuery 정규식

---

1. 기본 정규식

  > 숫자만 허용 : var chkNum = /^[0-9]+$/;

  > 공백 체크 : var chkBlank = /\s/g;

자주 사용하는 함수

---

1. search()

  > 검색된 문자열의 위치를 반환

  > 예시) 입력문자열 : 123123, 찾을문자열 : 312, 결과 : 2(index)

            

2. test()

  > 조건식을 만족하는지 여부를 boolean 타입으로 리턴

  > 예시) 주어진 문자열에 숫자가 포함되어 있는지 검사

    

$("#btnTest").click(function(){
    //정규식 설정
    var fncTest = /^[0-9]+$/;
    //정규식 결과 저장
    var testResult = fncTest.test( $("#inTest").val() );
});

3. replace()

  > 매개변수1에 해당하는 문자열을 매개변수2의 문자열로 교체

  > 예시) 마침표로 구분해서 교체

    

//버튼 클릭 이벤트
$("#btnReplace").on("click", function(){
    //텍스트 저장
    var txt = $("#inReplace").val();
    //정규식을 통해 텍스트 교체
    $("#inReplace").val( txt.replace( /(\w+)\.(\w+)/, "$2.$1" ) );
});

정규식 예제 모음

---

출처: https://develop88.tistory.com/entry/Jquery-정규식-예제 [왕 Blog]

Jquery 정규식 예제
출처:http://letusgo.tistory.com/30

기능	표현
모든 공백 체크	var regExp = /\s/g;
숫자만 체크	var regExp = /^[0-9]+$/;
이메일 체크	var regExp = /^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i;
핸드폰번호 체크	var regExp = /^\d{3}-\d{3,4}-\d{4}$/;  var regExp = /^01([0|1|6|7|8|9]?)-?([0-9]{3,4})-?([0-9]{4})$/
일반 전화번호 체크	var regExp = /^\d{2,3}-\d{3,4}-\d{4}$/;
문자,숫자 4~20자	var regExp = /^[a-z0-9_]{4,20}$/;
휴대폰번호 체크	var regExp = /^01([0|1|6|7|8|9]?)-?([0-9]{3,4})-?([0-9]{4})$/;

메타문자	사용		메타문자	사용
^	문자열의 시작		{n,m}	앞 문자가 n개 이상 m개 이하. {0,1} 은 ?와 같은 의미다.
$	문자열의 종료. 옵션에 따라 문장의  끝 또는 문서의 끝에 매치된다.		{n,}	앞 문자가 n개 이상. 위의 형태에서 m이 생략된 형태이다.  {0,} 이면 *와 같고 {1,} 이면 +와 같은 의미이다.
.	임의의 한 문자		{n}	앞 문자가 정확히 n개. {n,n} 과 같은 의미이다.
[]	문자 클래스. 문자 클래스 안에 들어가 있는  문자는 그 바깥에서 하나의 문자로 취급된다.		()	하나의 패턴구분자 안에 서브 패턴을 지정해서 사용할 경우  괄호로 묶어주는 방식을 사용한다.
^	문자 클래스 내에서 ^는 not		\s	공백문자
-	ex) a-z는 a에서 z까지의 문자		\b	문자와 공백 사이를 의미한다.
|	or를 나타냄		\d	숫자 [0-9]와 같다.
?	앞 문자가 없거나 하나 있음		\t	탭문자
+	앞 문자가 하나 이상임		\w	단어 영문자+숫자+_(밑줄) [0-9a-zA-Z_]
*	앞 문자가 0개 이상임			문자 이스케이프는 대문자로 적으면 반대를 의미한다.

 
 
var re = /s$/;          -- 공백체크
var re = /^ss*$/;   -- 공백문자 개행문자만 입력 거절
var re = /^[-!#$%& amp;'*+./0-9=?A-Z^_a-z{|}~]+@[-!#$%&'*+/0-9=?A-Z^_a-z{|}~]+.[-!#$%& amp;'*+./0-9=?A-Z^_a-z{|}~]+$/; --이메일 체크
var re = /^[A-Za-z0-9]{4,10}$/ -- 비밀번호,아이디체크 영문,숫자만허용, 4~10자리
var re = new RegExp("(http|https|ftp|telnet|news|irc)://([-/.a-zA-Z0-9_~#%$?&=:200-377()]+)","gi") -- 홈페이지 체크

var re = "<[^<|>]*>";  -- 태그제거
var re = /[<][^>]*[>]/gi;-- 태그제거
str = str.replace(RegExpTag,"");

var RegExpJS = "<script[^>]*>(.*?)</script>";  -- 스크립트 제거 
str = str.replace(RegExpJS,"");

var RegExpCSS = "<style[^>]*>(.*?)";  -- 스타일 제거 
str = str.replace(RegExpCSS,"");

var RegExpHG = "(/[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/)";  -- 한글 제거 
str = str.replace(RegExpHG,""); 
 
var RegExpDS = /<!--[^>](.*?)-->/g;   -- 주석 제거 
str6 = str.replace(RegExpDS,"");

var regExp = /[a-z0-9]{2,}@[a-z0-9-]{2,}.[a-z0-9]{2,}/i; --이메일 체크


## 기타 응용
re = new RegExp("^@[a-zA-Z0-9]+s+","i");//문장의 처음이 @이고 문자가 1나 이상 있으면 ok

 

기타 상기와 동일하나 약간씩 다른 샘픔
영숫자 조합책크
if ((new RegExp(/[^a-z|^0-9]/gi)).test(frm.loginid.value)) {
    alert("ID는 영숫자 조합만 사용하세요");
    frm.loginid.focus();
}

홈페이지 주소 책크
 function chk(v){
  str='';
  re = new RegExp("^http://","i"); 
  re.test(v)?str='y':str='n';
  alert(str);
 }

hanmail인지를 책크
 function chk(v){
  str='';
  re = new RegExp("hanmail.net","i"); 
  re.test(v)?str=true:str=false;
  return str
 }

//본문내에서 도메인 구하기
var patt = /(http(s)?://)?w+(.w+)+/gi;
      var result = (aa.value.match(patt));

//본문내에서 url구하기
상기와 유사 var patt = /(http(s)?://)?w+(.w+).S*-gi;

########### 정규식 메소드 및 사용법

참조 http://eknote.tistory.com/1251
참조 http://www.javascriptkit.com/javatutors/redev3.shtml
RegExp.exec(string)
RegExp.test(string)
String.match(pattern)
String.search(pattern)
String.replace(pattern,string)
String.split(pattern)

 

 

 

 

 

 

 

* 특수문자 검증 및 제거

function regExp(){ 
 //특수문자 검증 start
 var str = "2011-12-27";
 var regExp = /[\{\}\[\]\/?.,;:|\)*~`!^\-_+<>@\#$%&\\\=\(\'\"]/gi
 if(regExp.test(str)){
  //특수문자 제거
  var t = str.replace(regExp, "")
  alert("특수문자를 제거했습니다. ==>" + t)
 }else{
  alert("정상적인 문자입니다. ==>" + str)
 }
 //특수문자 검증 end
}

 

 

* 닉네임 체크 - 특문 제외 2자 ~ 20자

var pattern = /^[\w\Wㄱ-ㅎㅏ-ㅣ가-힣]{2,20}$/;

[\w]는 [A-Za-z0-9_] 이다
[\W]는 \w를 제외한 특수문자들이다.
[ㄱ-ㅎ] 은  ㄱㄴㄷㄹㅁㅂㅅㅇㅈㅊㅋㅌㅍㅎ
[ㅏ-ㅣ]는 ㅏㅑㅓㅕㅗㅛㅜㅠㅡㅣ
[가-힣]는 가나다라~~타파하 ~ 기니디리~ 티피히 ~ 각낙닥락 ~ 틱픽힉 ~ 깋닣딯맇 ~ 팋핗힣  이 된다.


즉 그냥 모든 문자열에 대한 {2,20} 글자 수 체크가 된다.

 

 

 

 

 

 

 

 

****

 

var pattern = 정규식;
var testee = "테스트 스트링";
var true_or_false = pattern.test( testee);  // 정규식 필터를 통과하면 true, 아니면 false 리턴.

다른 방법들도 있는데 나는 그냥 위와 같이 사용중이다.
아래는 내가 사용하는 정규식 몇 가지 예제..

1) 정수와 소수점 달고다니는 수들만 통과시키는 필터. 예를 들어 '12' '12.123' '-0.571' '-8100' 등에 대해 true를 리턴하고 나머지는 false 리턴.
 
var pattern =  /^[-]?\d+(?:[.]\d+)?$/;
return pattern.test( testee);

1-2) 위의 필터에서 좀더 조건을 추가해서, 양수면서 최대 소수점 2자리 이하까지만 통과시키는 필터. 예를 들어 12.23, 0.41, 51 등에는 true를 리턴하고, -12, -9.43, 1.234 등에는 false를 리턴하는 필터.
var pattern = /^\d+(?:[.]?[\d]?[\d])?$/;
return pattern.test( testee);

2) 숫자 및 x, X, P, E 만 포함한 스트링만 통과시키는 필터.
예를 들어,
x123 : true
XPE : true
125 : true
1234O : false
pXP : false

var pattern = /[^1234567890xXPE]/;
return !(pattern.test( testee));

3) 문자 전체에서 특수문자를 하나라도 포함하지 않아야만 함
예를 들어,
@123 : false
12Hello5 : true
!!! : false

var pattern = /[^\w\s]/i;
return !(pattern.test( testee));

4) 다음과 같은 형식만 통과함. Q로 시작하면서, 0000~9999 까지의 숫자만 Q 뒤에 달고 있어야 함.
즉,
Q0001, Q0002, Q1234, Q9999  : true
Q00, Q194, Q1  : false
Q0001A  : false
QUESTION : false

var pattern = /^Q[0-9][0-9][0-9][0-9]$/;
return pattern.test( testee);


5) 정규식에서 g 플래그를 쓸 때 주의해야 한다. 최근에 매칭한 곳에서부터 다시 정규식 검사를 시작하는 속성이 있다.

이것때문에 다음 문제가 일어난다. 연속적으로 한 스트링에 대해 정규식 테스팅을 하면, 처음에는 필터가 잘 동작하다가 나중에는 통과하지 말아야 할 조건을 가진 스트링이 정규식 패턴을 통과했다고 나오게 된다. 구글에서 'regex g flag consecutive' 등으로 검색하면 이 문제로 매우 많은 질문과 답이 나온다. 해결 방법은.. 난 g 플래그 대신 i 플래그를 줘서 해결했다. 아래 링크도 도움이 될 것이다.

http://stackoverflow.com/questions/15610251/why-pattern-testname-opposite-results-on-consecutive-calls
http://stackoverflow.com/questions/6739136/consecutive-calls-to-regexp-test-fail-for-pattern-with-global-option


6) 문자열 양 끝에 공백문자를 없애 주는 정규식. 예를 들어 "   hi hello! "; 를 "hi hello!"; 로 바꿔 주는 코드.
(출처 : http://stackoverflow.com/questions/3000649/trim-spaces-from-start-and-end-of-string)

function trim_whitespace( str)
{
    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}


7) "[192.244.1.123]" 같은 string에서 안의 ip부분만 빼낸다("192.244.1.123" 을 빼내는 작업)
function main()
{
    var regex = /\[([.\d]+)]/;
    var str = "[192.244.1.123]";
    var res = regex.exec( str);
   
    // print res[1] = "192.244.1.123";
}

 

 

 

// 정규식 휴대폰 번호 마스킹

** 출처 : http://ironnip.tistory.com/15

 

- num  : '-' 문자가 들어있지않은 숫자로된 전화번호

- type : 0 을 보내면 가운데 자리 마스킹

 

function phoneFomatter(num,type){

   

    var formatNum = '';

   

    if(num.length==11){

        if(type==0){

            formatNum = num.replace(/(\d{3})(\d{4})(\d{4})/, '$1-****-$3');

        }else{

            formatNum = num.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3');

        }

    }else if(num.length==8){

        formatNum = num.replace(/(\d{4})(\d{4})/, '$1-$2');

    }else{

        if(num.indexOf('02')==0){

            if(type==0){

                formatNum = num.replace(/(\d{2})(\d{4})(\d{4})/, '$1-****-$3');

            }else{

                formatNum = num.replace(/(\d{2})(\d{4})(\d{4})/, '$1-$2-$3');

            }

        }else{

            if(type==0){

                formatNum = num.replace(/(\d{3})(\d{3})(\d{4})/, '$1-***-$3');

            }else{

                formatNum = num.replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3');

            }

        }

    }

    return formatNum;

   

}

 

 

phoneFomatter('01000000000');   //010-0000-0000

phoneFomatter('01000000000',0); //010-****-0000

phoneFomatter('0100000000');    //010-000-0000

phoneFomatter('0100000000',0);  //010-***-0000

phoneFomatter('0200000000');    //02-0000-0000

phoneFomatter('0200000000',0);  //02-****-0000

phoneFomatter('0310000000');    //031-000-0000

phoneFomatter('0310000000',0);  //031-***-0000

phoneFomatter('16880000');      //1688-0000