[ 모던 자바스크립트 스터디 ] 정규 표현식

학교 다닐때 배웠던 기억이 새록새록 나는 것 같다.

 

const tel = '010-1234-567팔';

const regExp = /^\d{3}-\d{4}-\d{4}$/;

regExp.test(tel); // false

 

정규 표현식 생성

 

두가지 방법이 있다.

정규표현식 리터럴과 RegExp 생성자 함수를 사용하는 것이다.

일반적으로는 정규 표현식 리터럴을 사용한다.

 

 

const target = 'Is this all there is?';

const regexp = /is/i;

regexp.test(target); -> true

 

여기서 정규표현식의 /(슬래시) 뒤 i 는 대소문자를 구별하지 않고 검색하는 플래그이다.

test 메서드는 target 문자열에 대해 정규표현식 regexp 패턴을 검색하여 매칭 결과를 불리언 값으로 반환한다.

 

 

new RegExp(pattern[, flags])

 

위와 같이 생성자 함수 RegExp 를 사용해 RegExp 객체를 만들 수도 있다.

const target = 'Is this all there is?';

const regexp = new RegExp(/is/i); // ES6
// const regexp = new RegExp(/is/, 'i');
// const regexp = new RegExp(is, 'i');

regexp.test(target); // true

 

 

 

RegExp 메서드

 

RegExp.prototype.exec

 

인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색해 매칭 결과를 배열로 반환한다.

결과가 없으면 null 을 반환한다.

 

 

const target = 'Is this all there is?';
const regExp = /is/;

regExp.exec(target);

 

 

 

exec 메서드는 문자열 내의 모든 패턴을 검색하는 g 플래그를 지정해도 첫번째 매칭 결과만 반환한다.

 

 

 

RegExp.prototype.test

 

인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 불리언 값으로 반환한다.

 

const target = 'Is this all there is?';
const regExp = /is/g;

regExp.test(target); // true

 

 

String.prototype.match

 

String 표준 빌트인 객체가 제공하는 match 메서드는

대상 문자열과 인수로 전달받은 정규 표현식과의 매칭 결과를 배열로 반환한다.

 

 

const target = 'Is this all there is?';
const regExp = /is/;

target.match(regExp);

 

 

 

이 메서드는 g 플래그 지정시 모든 매칭 결과를 배열로 반환한다.

 

 

 

플래그

 

총 6개 있는데, 그중 가장 많이 쓰이는 3개는 아래와 같다.

 

• i : 대소문자 구별 x
• g : 전역 검색
• m : 멀티 라인

만약 전역 검색이 플래그가 설정되어 있지 않을 시

문자열에 패턴 매칭 대상이 1개 이상 있어도 첫번째 대상만 검색하고 종료한다.

 

 

패턴

 

패턴은 /로 열고 닫으며 문자열의 따옴표는 생략한다.

 

 

임의의 문자열 검색

. 은 문자 하나를 의미한다.

 

 

반복 검색

 

{m,n} 은 앞 패턴이 최소 m번, 최대 n 번 반복되는 문자열을 의미한다.

, 뒤에 공백이 있으면 안된다.

 

const target = 'A AA B BB Aa Bb AAA';

const regExp = /A{1,2}/g;

target.match(regExp);

 

 

패턴 n 번 반복 : {n}

패턴 최소 n 번 이상 반복 : {n,}

패턴 최소 한번 이상 반복 : +

 

+는 {1,} 과 같다.

 

 

const target = 'A AA B BB Aa Bb AAA';

const regExp = /A+/g;

target.match(regExp);

 

 

 

? 는 패턴이 최대 한 번 이상 반복되는 의미이다.

 

 

const target = 'color colour';

const regExp = /colou?r/g;

target.match(regExp);

 

 

 

 

OR 검색

 

| (파이프) 는 or 의 의미를 갖는다.

/A|B/ 는 A 혹은 B 를 의미한다.

 

분해되지 않은 단어 레벨로 검색하기 위해서는 +를 함께 사용한다.

 

const target = 'A AA B BB Aa Bb';

const regExp = /A+|B+/g;

target.match(regExp);

 

 

 

[] 내의 문자는 or로 동작한다. 그 뒤에 +를 앞선 패턴을 한 번 이상 반복한다.

 

const target = 'A AA B BB Aa Bb';

const regExp = /[AB]+/g;

target.match(regExp);

 

 

 

-를 사용하면 범위표현도 가능하다.

[a-zA-Z0-9] 와 같이 한다.

 

0-9는 \d 로, \D 는 \d 와 반대로 동작한다.

\w 는 알파벳, 숫자, 언더스코어를 의미하고, \W 는 반대로 동작한다.

 

NOT 검색

[ ] 내의 ^ 는 not 의 의미다.

 

[^0-9] 는 숫자를 제외한 문자를 의미한다.

 

시작 위치로 검색

 

[ ] 밖의 ^은 문자열 시작을 의미한다.

 

마지막 위치로 검색

 

$는 문자열의 마지막을 의미한다.

 

const target = 'https://google.com';

let regExp = /^https/;

regExp.test(target);

regExp = /com$/;

regExp.test(target);