정규표현식
- 특정한 규칙을 가진 문자열의 집합을 표현하는데 사용하는 형식 언어2. 주로 프로그래밍 언어나 텍스트 에디터 등에서 문자열의 검색과 치환을 위한 용도로 사용됨3. 입력한 문자열에서 특정한 조건을 표현할 경우 다소 복잡할 수 있지만 표현식을 숙지하면 매우 간단하게 표현할 수 있음.
정규표현식의 객체 생성
$('#btn-regex1').on("click",function(){
var area=$('#area-tag1') //출력할 영역
var target = "javascript jquery ajax";
//기준문자열
var regExp=/script/;
//비교문자열
var str ="";
//출력을 위한 문자열 선언
str += regExp.test(target)+"<br>"; //test(타겟) , 타겟이 있는지 없는지 true or false 반환
str += regExp.exec(target)+"<br>"; //exec(타켓), 비교문자열을 문자로 전환하여 반환
str += target.replace(regExp,"스크립트")+"<br>"; //replace(타겟,"문자열") 타겟을 오른쪽 문자열로 변환
area.html(str);
//자바스크립트 변환
// area.innerHTML+=regExp.test(target)+"<br>";
// area.innerHTML+=regExp.exec(target)+"<br>"
// area.innerHTML+= target.replace(regExp,"스크립트")+"<br>"
});플래그 문자
g : 전역비교를 수행i : 대소문자 구분하지 않음m : 여러줄 검사 수행 앵커문자와 같이 사용
var flagtn = document.querySelector('#btn-flag')
var area = document.querySelector("#area-tag2");
flagtn.addEventListener("click",function(){//버튼클릭하면 함수시작
var target = "javascript jquery Ajax";
var target2 = "javascript\n jquery\n Ajax"
var regExp = /a/g; //기준문자열에서 a를 전부 찾는다
var regExp1 = /a/gi; //기준문자열에서 대소문자 구분하지 않고 a를 찾는다
var regExp2 = /a/gi;
var str ="";
str += target.replace(regExp,'A')+"<br>"; //비교문자열의 값을 전부 A로 바꾼다
str += target.replace(regExp1,"($&)")+"<br>"; //비교문자열의 값을 (비교문자)로 바꾼다
str += target2.replace(regExp2,'($&)')+"<br>";
area.innerHTML=str;
})
//출력결과
// jAvAscript jquery AjAx 소문자 a가 전부 A로 변환
// j(a)v(a)script jquery (A)j(a)x 대소문자 구분없이 ()쳐짐
// j(a)vascript jquery Ajax 개행이 되었기때문에 g가 들어갔는데도 첫 a만 인식했다
//1 - m을빼면 한 줄만 검사하게 된다 실제 개행으로 출력되지 않지만
\n은 개행을 인식하기때문에 개행된 문자열을 검사할경우 m을 붙여 개행한것도 검사하도록 해주어야 한다.
- 만약 regExp2에 m을 추가해서 개행을 인식하게 했다면
j(a)v(a)script jquery (A)j(a)x가 출력되었을것이다.
앵커 문자
문자열의 앞과 뒤를 구분해주는 정규표현식 기호
var area3 = $('#area-tag3')
$("#btn-ank").on("click",function(){
var target = "javascript jquery Ajax javascript";
var target1 = "javascript\n jquery\n Ajax\n javascript\n";
var regExp = /^j/igm; //첫 j를 찾는다 대문자도 인식한다. 개행도인식한다
var regExp2 = /ipt$/igm; //마지막 ipt를 찾는다
var str ="";
str += target.replace(regExp,"($&)")+"<br>";
str += target.replace(regExp2,"($&)")+"<br>";
str += target1.replace(regExp,"($&)")+"<br>";
str += target1.replace(regExp2,"($&)") ;
area3.html(str)
});
////////////////////참고용 출력값/////////////////////////////
// (j)avascript jquery Ajax javascript
// javascript jquery Ajax javascr(ipt)
// (j)avascript jquery Ajax javascript
// javascr(ipt) jquery Ajax javascr(ipt)- 개행시 첫글자는 첫줄밖에 인식하지 않았지만 마지막 글자는 모든 열마다 인식했다.
메타문자
[] : 대괄호 사이에 존재하는 문자들 중 하나 일치
- 메타문자로 된 첫 문자를 찾으려면
^[메타문자]로 활용하면 된다[^문자]를 쓰면 문자부분을 제외하고 검색된다
추가 메타 문자
\d : 숫자
\w : 아무 단어 전부(숫자포함
)\s : 공백문자(탭, 띄어쓰기, 줄바꿈)
\D : 숫자가 아닌것
\W : 단어가 아닌것
\S : 공백문자가 아닌것
var metaBtn = document.querySelector("#btn-meta")
metaBtn.addEventListener("click",function(){
var target = "javascript jquery Ajax";
var regExp = /[aj]/gi; //[ab] = a||b
var regExp2 = /[^aj]/gi; //[^aj] = a와 j를 제외한 모든 문자를 찾는다
var area = document.querySelector('#area-tag4')
var str ="";
area.innerHTML+= target.replace(regExp,"($&)")+"<br>";
area.innerHTML+= target.replace(regExp2,"($&)")+"<br>";
var target2 = "123javascript";
var onlySmallEng = /[a-z]/g; //모든 소문자를 찾는다
var onlyBigEng=/[A-Z]/g; //모든 대문자를 찾는다
var onlyNumber=/[1-9]/g; //모든 숫자를 찾는다
// var onlyKorean=/[ㄱ-힣]/g; //모든 한글을 찾는다
area.innerHTML += target2.replace(onlySmallEng,"($&)")+"<br>";
area.innerHTML += target2.replace(onlyBigEng,"($&)")+"<br>";
area.innerHTML += target2.replace(onlyNumber,"($&)")+"<br>";수량문자
a+ : a가 적어도 1개 이상
a* : a가 0개 또는 여러개
a? : a가 0개 또는 1개
a{5} : a가 5개
a{2,5} : a가 2~5개
a{2, } : a가 2개 이상
a{ ,2} : a가 2개 이하
a는 메타 문자로 주로 사용
- 주민번호 유효성 검사
$('#btn-extra-btn').on("click",function(){ var target = $('[name="personal-number"]').val(); //personal-number의 입력값을 정의한다 //1 var regExp=/\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])-[1-4]\d{6}/ if(regExp.test(target)){ alert("정상입력됐습니다") }else{ alert("입력오류") } })/\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2][0-9]|3[0-1])-[1-4]\d{6}/- \d = 숫자를 뜻한다.
- \d{2} : 숫자가 반드시 2개일것
(0[1-9]|1[0-2]): 첫글자0 두번째 글자 1~9 or 첫글자1 두번째 0~2(0[1-9]|[1-2][0-9]|3[0-1])- 첫글자 0 두번째 1~9 or 첫글자 1~2 두번째 0~9 or 첫글자 3 두번째 0~1
- \d = 숫자를 뜻한다.
정규표현식 참고 사이트 : Regexper
hello world