[자바스크립트] 정규 표현식 기본

정규식이란?

정규 표현식(regular expression)은 문자 검색과 교체에 사용되는 패턴으로 강력한 기능을 제공하며,

자바스크립트에선 RegExp 객체와 문자열 메서드를 조합해 정규표현식을 사용할 수 있다.

 

정식 문법 

regexp = new RegExp("pattern", "flags");

약식 문법

regexp = /pattern/; // 플래그가 없음
regexp = /pattern/gmi; // 플래그 g, m, i가 있음

슬러시"/"는 자바스크립트에게 정규표현식을 생성하고 있따는 것을 알려준다.

 

플래그

정규 표현식의 검색에 영향을 주는 플래그를 선택적으로 붙일 수 있다.

자바스크립트는 6개의 플래그를 지원

• i 플래그가 붙으면 대·소문자 구분 없이 검색합니다. 따라서 A와 a에 차이가 없음
• g 플래그가 붙으면 패턴과 일치하는 모든 것들을 찾습니다. g 플래그가 없으면 패턴과 일치하는 첫 번째 결과만 반환
• m 다중 행 모드(multiline mode)를 활성화
• s.이 개행 문자 \n도 포함하도록 ‘dotall’ 모드를 활성화
• u유니코드 전체를 지원합니다. 이 플래그를 사용하면 서로게이트 쌍(surrogate pair)을 올바르게 처리
• y문자 내 특정 위치에서 검색을 진행하는 ‘sticky’ 모드를 활성화

 

match로 검색하기

• 정규 표현식에 플래그 g가 붙으면 패턴과 일치하는 모든 것을 담은 배열을 반환합니다.

let str = "We will, we will rock you";

alert( str.match(/we/gi) ); // We,we (패턴과 일치하는 부분 문자열 두 개를 담은 배열)

 

• 플래그 g가 붙지 않은 경우엔 패턴에 맞는 첫 번째 부분 문자열만 담은 배열을 반환합니다. 해당 문자열은 배열 인덱스 0에 저장되는데 이 문자열의 프로퍼티엔 상세한 추가 정보가 저장됩니다.

let str = "We will, we will rock you";

let result = str.match(/we/i); // 플래그 g 없음

alert( result[0] );     // We (패턴에 일치하는 첫 번째 부분 문자열)
alert( result.length ); // 1

// Details:
alert( result.index );  // 0 (부분 문자열의 위치)
alert( result.input );  // We will, we will rock you (원본 문자열)

 

replace로 치환하기

메서드 str.replace(regexp, replacement)를 사용하면 str 내 부분 문자열 중 regexp에 일치하는 부분 문자열을 replacement로 교체할 수 있습니다. 이때 플래그 g가 있으면 모든 부분 문자열이 교체되고, 그렇지 않으면 첫 번째 부분 문자열만 교체됩니다.

// 플래그 g 없음
alert( "We will, we will".replace(/we/i, "I") ); // I will, we will

// 플래그 g 있음
alert( "We will, we will".replace(/we/ig, "I") ); // I will, I will

여기서 두 번째 인수 replacement는 문자열인데, 문자열 안에 다음과 같은 특수 문자를 넣어주면 독특한 방식으로 문자열을 교체할 수 있습니다.

특수 문자교체 방식

$&	패턴과 일치하는 부분 문자열
$`	inserts a part of the string before the match
$'	inserts a part of the string after the match
$n	if n is a 1-2 digit number, then it inserts the contents of n-th parentheses, more about it in the chapter Capturing groups
$<name>	inserts the contents of the parentheses with the given name, more about it in the chapter Capturing groups
$$	inserts character $

$&를 사용한 예시를 살펴봅시다.

alert( "I love HTML".replace(/HTML/, "$& and JavaScript") ); 
// I love HTML and JavaScript

 

regexp.test로 일치 여부 확인하기

패턴과 일치하는 부분 문자열이 하나라도 있는 경우 메서드 regexp.test(str)을 호출하면 true가, 그렇지 않으면 false가 반환됩니다.

let str = "I love JavaScript";
let regexp = /LOVE/i;

alert( regexp.test(str) ); // true

 

요약

• 정규 표현식은 패턴과 선택적으로 사용할 수 있는 플래그 g, i, m, u, s, y로 구성됩니다.
• 플래그와 특수 기호(추후 학습)가 없는 경우엔 일반적인 부분 문자열 검색과 동일한 방식으로 검색이 진행됩니다.
• 플래그 g가 있는 경우엔 str.match(regexp)는 패턴과 일치하는 모든 부분 문자열을 검색합니다. g가 없는 경우엔 첫 번째 부분 문자열만 찾습니다.
• str.replace(regexp, replacement)는 regexp과 일치하는 부분 문자열을 replacement로 교체합니다. g 플래그가 있으면 부분 문자열 전체를, 없으면 첫 번째 부분 문자열을 교체합니다.
• 패턴과 일치하는 부분 문자열이 하나라도 있는 경우 regexp.test(str)는 true를 반환합니다. 그렇지 않으면 false가 반환됩니다.

 

출처:https://ko.javascript.info/regexp-introduction