31.1 정규 표현식?

: 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어.

• 자바스크립트의 고유 문법이 아니며, 대부분의 프로그래밍 언어와 코드 에디터에 내장되어 있다.
• 문자열을 대상으로 패턴 매칭 기능을 제공한다.

<aside>

패턴 매칭 기능 : 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능

</aside>

// 사용자로부터 입력받은 전화번호
const tel = '010-1234-567팔';

// 정규 표현식 리터럴로 전화번호 패턴을 정의한다
const regExp = /^\\d{3}-\\d{4}-\\d{4}$/;

// tel이 전화번호 패턴에 매칭되는지 테스트
regExp.test(tel);  //false

전화 번호 형식 검사

<aside>

/^\\d{3}-\\d{4}-\\d{4}$/ ^ : 문자열 시작

\\d{3}: 숫자 정확히 3개

- : 하이픈

\\d{4}: 숫자 정확히 4개

- : 하이픈

\\d{4}: 숫자 정확히 4개 $ : 문자열의 끝

</aside>

<aside>

결과가 false인 이유 : 세 번째 그룹 불일치

• 패턴: \\d{4} (4개 숫자 필요)
• 실제: 567팔 (3개 숫자 + 1개 한글)
• 팔은 \\d(숫자)가 아니므로 매칭 실패 </aside>

31.2 정규 표현식의 생성

정규 표현식 객체(RegExp 객체)를 생성하기 위해서는 정규 표현식 리터럴과 RegExp 생성자 함수를 사용할 수 있다. 일반적인 방법은 정규 표현식 리터럴을 사용하는 것이다.

정규 표현식 리터럴

<aside>

/regexp/i / : 시작, 종료 기호

regexp : 패턴

i : 플래그

</aside>

정규 표현식 객체 생성하기

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

const regexp = /is/i;
// 패턴: is => 문자열 is 찾기
// 플래그: i => 대소문자를 구별하지 않고 검색한다

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

<aside>

RegExp 생성자 함수를 사용하여 RegExp 객체를 생성하는 방법

</aside>

/**
* pattern: 정규 표현식의 패턴
* flag: 정규 표현식의 플래그(g,i,m,u,y)
*/
new RegExp(pattern[, flags])

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

const regexp = new RegExp(/is/i); //ES6 -> -> is 문자열을, 대소문자 구분 없이 찾는다
// const regexp = new RegExp(/is/, 'i');  
// const regexp = new RegExp('is', 'i'); 

console.log(regexp.test(target)); //true

<aside>

RegExp 생성자 함수를 사용하면 변수를 사용해 동적으로 RegExp 객체를 생성할 수 있다.

</aside>

const count = (str, char) => (str.match(new RegExp(char, 'gi')) ?? []).length;
//new RegExp(char, 'gi')
//char: 문자열을 정규표현식으로 바꿔줌
//g: 전체(global) 검색
//i: 대소문자 구분 없이

count('Is this all there is?', 'is'); //3 -> is가 3개 있음
count('Is this all there is?', 'xx'); // 0 -> xx는 없으므로 0