728x90
반응형

정규표현식

특정패턴을 지닌 문자열 집합을 검색할 수 있는 형식언어

유효성검사, 검색, 문자열대체 등 다양하게 활용(특정언어에 제약을 받지 않음)

일반적 조건문을 사용해서 검사하는 것보다 훨씬 간단하지만, 간단한만큼 표현식 숙지가 어려움

 

 

정규표현식 객체 생성 및 사용

btn1.onclick = () => {
    //1. new RegExp
    let regExp1 = new RegExp('script');
    //2. /정규표현식/
    let regExp2 = /script/;
    //3. 혼합
    let regExp3 = new RegExp(/script/);

    let str = 'javascript jquery ajax';

    //정규표현식 객체 메소드 : exec (제일 많이 사용하는 건 test)
    area1.innerHTML += regExp1.test(str) + "<br>";
    
    //문자열 메소드 : match
    area1.innerHTML += str.search(regExp1) + "<br>";
    area1.innerHTML += str.replace(regExp1, '스크립트') + "<br>";
    area1.innerHTML += str.split(regExp1) + "<br>";
    
    //정규표현식에 부합하는 문자열을 가리키는 변수 $&
    area1.innerHTML += str.replace(regExp1, '<mark>$&</mark>') + "<br>";
};

 

 

플래그문자

g : 전역비교

i : 대소문자를 구분하지 않음

m : 줄단위(\n)검사

 

 

메타문자

앵커문자 ^ $

 

 

한글자 .

btn.onclick = () => {
    let regExp = /a.b/;
    area4.innerHTML += 'ab'.replace(regExp, '<mark>$&</mark>') + "<br>";
    area4.innerHTML += 'acsdfsdfb'.replace(regExp, '<mark>$&</mark>') + "<br>";
    area4.innerHTML += 'acdb'.replace(regExp, '<mark>$&</mark>') + "<br>";
    area4.innerHTML += 'a b'.replace(regExp, '<mark>$&</mark>') + "<br>";

    let s1 = "going";
    let s2 = "inner";
    //in한글자 뒤에 끝나는 문자검사
    regExp = /in.$/
    console.log(regExp.test(s1));  //t
    console.log(regExp.test(s2));  //f
    
    s1 = "xabc";
    s2 = "abc";
    regExp = /^.ab/;  //임의의 한글자 이후에 ab로 시작하는 단어만 조회
    console.log(regExp.test(s1)); //t
    console.log(regExp.test(s2)); //f
};

 

 

[]

임의의 한글자 올 수 있는 범위 설정

btn.addEventListener('click', () => {
    let str = "Javascript JQuery Ajax 12345 한글";
    // let regExp = /[aj]/gi;
    // let regExp = /[^aj ]/gi;  //[]안에쓰인 ^은 시작이 아닌 반전
    // let regExp = /[a-z]/g; //알파벳 소문자
    // let regExp = /[A-Z]/g; //알파벳 대문자
    // let regExp = /[a-zA-Z]/g; //알파벳 대소문자
    // let regExp = /[0-9]/g; //숫자
    let regExp = /[가-힣]/g; //한글
    area6.innerHTML += str.replace(regExp, "<mark>$&</mark>");
});

 

 

영문자, 숫자, 공백문제에 대한 메타문자

\d 숫자

\w 영문자, 숫자, _

\s 공백문자(탭\t, 띄어쓰기, 줄바꿈\n)

\D 숫자 아님

\W (영문자, 숫자, _) 아님

\S 공백문자(탭\t, 띄어쓰기, 줄바꿈\n) 아님

btn8.addEventListener('click', () => {
    let s = "A1 B2 c3 d_4 e:5' ffGG77--++__==       가\n나\n다\n";
    // let regExp = /\d/g;
    let regExp = /[0-9]/g;
    
    // let regExp = /\w/g;
    let regExp = /[a-zA-Z0-9_]/g;
    
    // let regExp = /\s/g;
    let regExp = /[ \t\n]/g;
    
    // let regExp = /\D/g;
    let regExp = /[^0-9]/g;
    // let regExp = /\W/g;
    let regExp = /[^a-zA-Z0-9_]/g;
    // let regExp = /\S/g;
    let regExp = /[^ \t\n]/g;

    area8.innerHTML += "<pre>"+s.replace(regExp, "<mark>$&</mark>")+"<pre>";
});

 

() |

문자열을 or연산 할 수 있음

 

 

수량문자

a* : a가 0개 이상 {0,}

a+ : a가 1개 이상 {1,}

a? : a가 0,1개 {0,1}

a{2} : a가 딱 2개

 

 

Escaping

정규표현식 메타문자를 문자그대로 사용하고 싶은 경우, 이스케이핑처리 해야함

반응형

'프로그래밍 > JavaScript' 카테고리의 다른 글

Array.prototype.filter()  (0) 2021.03.05
화살표 함수  (0) 2021.02.10
07.22(이벤트)  (0) 2020.07.22
07.21(Window 객체, BOM, DOM )  (0) 2020.07.21
07.20(객체)  (0) 2020.07.20
복사했습니다!