[JavaScript] 정규 표현식(RegExp)의 개념

 

 

 

 

정규 표현식이란?

---

정규 표현식이란 regular expression를 줄여 RegExp라고 불리며, 특정한 '패턴'을 가진 '문자열'의 '집합'을 표현하기 위해 사용하는 '형식 언어(formal language)'를 말합니다.

 

쉽게 말해, 정규 표현식은 문자열에서 특정한 규칙을 가지는 문자열의 집합을 찾아내기 위한 검색 패턴이라고 말할수있습니다.

정규 표현식은 자바스크립트의 고유 문법이 아니며, 대부분의 프로그램 언어와 코드 에디터에 내장되어 있으며, 자바스크립트는 정규 표현식 문법을 ES3부터 도입하였습니다.

 

정규 표현식을 사용하면, 복잡한 조건문이 아닌 한 줄로 간단히 표시할 수 있습니다.

 

 

 

 

 

 

 

정규 표현식의 역할

---

정규 표현식은 문자열을 대상으로 '패턴 매칭 기능'을 제공합니다.
패턴 매칭 기능이란 특정 패턴과 일치하는 문자열을 검색, 추출, 치환(대체)할 수 있는 기능을 말합니다.

즉, 반복문과 조건문 없이 패턴을 가진 문자열을 간단하게 검색, 추출, 치환할 수 있습니다.

간단한 문자 검색부터 이메일, 패스워드 검사(유효성 검사) 등의 복잡한 문자 일치 기능 등을 정규 표현식 패턴으로 빠르게 수행할 수 있습니다.

 

 

 

 

 

자주 사용되는 상황

---

아래와 같은 상황에서 사용될 수 있습니다.

- text에서 원하는 특정 pattern을 찾을 때 (전화번호/ 홈페이지 등)
- pattern을 다른 문자열로 변환
- 사용자가 입력한 데이터가 특정 pattern에 유효한지 유효성 검사 (이메일 / 비밀번호)

 

 

 

 

 

 

 

정규 표현식의 생성 규칙

---

자바스크립트에서 정규 표현식을 만드는 방법은 다음과 같습니다.
1. 정규 표현식 리터럴을 이용한 생성
2. RegExp 객체를 이용한 생성

3. 재할당 방식(Re-compile)

 

1. 정규 표현식 리터럴을 이용한 생성

리터럴(Literal)이란 데이터 그 자체 즉, 변수에 넣는 변하지 않는 데이터를 의미합니다.

그렇지만, 상수와는 다른 의미를 가집니다. 상수는 변하지 않는 변수를 의미하지만(메모리 위치), 리터럴은 변수의 값이 변하지 않는 데이터를 의미합니다(메모리 위치 안의 값).

 

문법
/검색 패턴/플래그

 

정규 표현식 리터럴은 슬래시(/) 기호로 시작하여, 슬래시(/) 기호로 끝나며, 필요에 따라 플래그를 추가하여 기본 검색 설정을 변경할 수도 있습니다.

//패턴
const regexpA = /^abc/;  

//패턴, 플래그
const regexpB = /^abc/gi;

정규 표현식 리터럴을 사용하면 정규 표현식 객체가 생성됩니다. 정규 표현식 리터럴을 사용하는 것이 일반적인 방법입니다.

하지만, 상황에 따라 RegExg 생성자 함수를 써야만 하는 경우도 있습니다.

 

2. RegExp 생성자 함수 방식

RegExg 생성자 함수를 호출하여 RegExp 객체를 생성할 수도 있습니다.

const regexp1 = new RegExp(/^abc/i); // ES6
const regexp2 = new RegExp(/^abc/, 'i');
const regexp3 = new RegExp('^abc', 'i');

 

3. 재할당 방식(Re-compile)

사용 중인 정규 표현식을 재할당할 수도 있습니다. 단, 상수가 아닌 변수로 선언해야 합니다.

let regexp1 = /ipsum/g;
regexp1 = /lorem/i;
console.log(regexp1); // --> /lorem/i
const regexp2 = /ipsum/g;
regexp2 = /lorem/i;  // --> TypeError

 

 

 

 

 

 

 

정규 표현식 관련 JavaScript 메소드

---

자바스크립트에서는 정규 표현식을 다루는 다양한 메소드들을 제공합니다.

 

1. 정규식.exec(문자열)

exec 메서드는 인자로 전달받은 문자열에 대해 ‘정규 표현식의 패턴을 검색’하여 ‘매칭 결과를 배열로 반환’합니다.
매칭 결과가 없는 경우 null을 반환하는데, 주의해야 할 점은 exec 메서드는 문자열 내의 모든 패턴을 검색하는 g 플래그를 지정해도 첫 번째 매칭 결과만 반환해준다는 점입니다.

const target = 'Is this all there is?';
const regExp = /is/;
regExp.exec(target);
// --> ["is", index: 5, input: "Is this all there is?", groups: undefined]

 

2. 정규식.test(문자열)

test 메서드는 인자로 전달받은 문자열에 대해 ‘정규 표현식의 패턴을 검색’하여 매칭 결과를 Boolean 값으로 반환합니다.

const target = 'Is this all there is?';
const regExp = /is/;
regExp.test(target); // --> true

 

3. 문자열.match(정규식)

String 표준 빌트인 객체가 제공하는 match 메서드는 대상 문자열과 인자로 전달받은 정규 표현식과의 매칭 결과를 배열로 반환합니다. 매칭 결과가 없는 경우 null을 반환합니다.

Built-in이란?
단어의 의미는 ‘사전에 준비되어 있는 것’을 말합니다.
자바스크립트에서 ‘빌트인’은 자바스크립트 코드가 처리되는 영역에 먼저 만들어둔 값, 연산자, 객체를 의미합니다. 따라서 흔히 사용되는 Number, String, Boolean이라는 Type은 빌트인 되어있는 값들이라는 것을 알 수 있습니다.

 

const target = 'Is this all there is?';
const regExp = /is/;
target.match(regExp); // 인자안에 regExp 가 들었음을 주목
// --> ["is", index: 5, input: "Is this all there is?", groups: undefined]

하지만 exec 메서드와 결과 값이 똑같은 경우가 있습니다. exec 메서드는 문자열 내의 모든 패턴을 검색하는 g 플래그를 지정해도 첫 번째 매칭 결과만 반환하기 때문입니다.

 

4. 문자열.search(정규식)

-일치하는 문자열의 인덱스(Number)를 반환합니다.

5. 문자열.replace(정규식, 대체 문자)

-일치하는 문자열을 대체하고 대체된 문자열을 반환합니다.

6. 문자열.split(정규식)

- 일치하는 문자열을 분할하여 배열(Array)로 반환합니다.

7. 생성자_정규식.toString()

- 생성자 함수 방식의 정규식을 리터럴 방식의 문자열로 반환합니다.

 

 

 

 

 

 

 

 

플래그(Flag)

---

‘플래그’는 정규 표현식의 옵션으로서, 검색 방식을 설정하기 위해 사용합니다.

원하는 문자 검색 결과를 반환하도록 할 수 있는데, 플래그에 따라 전혀 다른 결과가 나올 수 있습니다.
플래그는 옵션이므로 순서와 상관없이 하나 이상의 플래그를 동시에 설정할 수도 있습니다.

 

정규 표현식과 메소드 사용 시 기본적으로 대소문자 구별해서 패턴을 검색을 하며, 기본적으로 문자열의 패턴 검색 매칭 대상이 1개 이상 존재해도 첫 번째 매칭 한 대상만 검색하고 종료합니다.

 

g(global) 플래그

‘모든 문자를 검색하겠다’는 의미이며, g 가 있는 표현식은 모든 검색 결과를 배열로 반환합니다.

 

i(ignoreCase) 플래그

‘영어 대소문자를 구분하지 않겠다’는 의미이며, ig를 같이 사용하게 되면 대소문자 구분 없이 표현식의 모든 검색 결과를 배열로 반환합니다.

 

m(multi line) 플래그

‘문자열의 행이 바뀌더라도 패턴 검색을 계속한다’는 의미입니다.

 

y(sticky) 플래그

생성된 정규 표현식 인스턴스에서는 lastIndex라는 속성을 사용할 수 있습니다.

lastIndex 속성에 숫자를 지정한 뒤 플래그 y로 검색하면, 그 숫자와 일치하는 index의 문자만 검색합니다.

lastIndex 속성은 1회용이며, 'Read-only'입니다.플래그 y와 g를 함께 사용할 경우, 플래그 g는 무시됩니다. (단독으로 사용할 것을 추천)

 

u(unicode) 플래그

유니 코드 문자를 처리하기 위한 플래그이며, 패턴 []을 이용하여 유니 코드 문자의 범위(구간)를 지정할 수도 있습니다.