정규 표현식(Regex)

gjeon·2022년 2월 23일
JavaScript정규표현식
0

JavaScript

목록 보기
6/6

정규 표현식이란?

  • 특정한 규칙을 가진 문자열의 집합을 표현하는 데 사용하는 형식.
  • 줄여서 ‘정규식' 이라고도 한다.

정규 표현식 만들기

정규식을 만드는 방법에는 두 가지가 있다.
1.정규식 리터럴(슬래쉬로 감싸는 패턴)을 사용하는 방법.

  • let re = /ab+c/

2.RegExp 객체의 생성자 함수를 호출하는 방법.

  • let re = new RegExp("ab+c");
  • flag
    a. let re = new RegExp('ab+c', 'i');
    b. let re = new RegExp('/ab+c/', 'i');
    c. let re = new RegExp('/ab+c/i'); //ES6

정규 표현식 구성

메타 문자(Metacharacter)

정규표현식에서 사용하는 기호를 말한다.

표현식의미예의미
^문자열의 시작^xx 문자로 문자열이 시작
$문자열의 종료x$x 문자로 문자열이 종료
.임의의 한 문자 (문자의 종류를 가리지 않지만 \는 넣을 수 없음).x임의의 한 문자가 x로 끝남
+앞 문자가 하나 이상x+x 문자가 한 번 이상 반복됨
?앞 문자의 존재 여부x?x 문자가 존재할 수도, 존재하지 않을 수도 있음
*앞 문자의 반복 여부 (없을 수도 있음)x*x 문자가 0번 또는 그 이상 반복됨
|or을 표현x|yx 또는 y 문자가 존재
()그룹을 표현(x)x 를 그룹으로 처리함
()()그룹들의 집합을 표현. 앞에서 부터 순서대로 번호를 부여하여 관리(x)(y)x, y 는 각 그룹의 데이터로 관리
()(?:)그룹들의 집합에 대한 예외를 표현하며 그룹 집합으로 관리되지 않음을 의미(x)(?:y)
{n}앞의 문자가 n번 반복x{n}
{n,}앞의 문자가 n번 이상 반복x{n,}
{n,m}앞의 문자가 최소 n번 이상, 최대 m번 이하로 반복x{n,m}
[]내부에 지정된 문자열의 범위 중에서 한 문자만을 선택[xy]x 와 y 문자 중에 하나
[^]not을 표현[^xy]x, y 를 제외한 문자
[-]range를 표현[a-z]a ~ z 사이의 문자
\ escape를 표현. 뒤에 특수문자가 오면 특수문자가 아닌 문자 자체를 의미\^^를 문자로 사용
\bword boundary를 표현. 문자와 공백 사이의 문자를 의미\bby\b앞과 뒤가 공백인 by 문자열
\Bnon word boundary를 표현. 문자와 공백 사이가 아닌 문자를 의미\Bcl\B앞과 뒤가 공백이 아닌 cl 문자열
\ddigit를 표현(숫자)
\Dnon digit를 표현(숫자가 아닌 문자)
\sspace를 표현(공백)
\Snon space를 표현(공백 문자가 아닌 문자)
\ttab을 표현(tab 문자)
\vvertical tab을 표현(수직 탭)
\wword를 표현 (알파벳 + 숫자 + _)
\Wnon word를 표현 (알파벳 + 숫자 + _ 가 아닌 문자)

플래그(Flag)

FlagMeaningDescription
iIgnore Case대소문자를 구별하지 않고 검색한다.
gGlobal문자열 내의 모든 패턴을 검색한다.
mMulti Line문자열의 행이 바뀌더라도 검색을 계속한다.

패턴(Pattern)

패턴에는 검색하고 싶은 문자열을 지정한다.
이때 문자열의 따옴표는 생략한다. (따옴표를 포함하면 따옴표까지 검색한다.)
또한 패턴은 특별한 의미를 가지는 메타 문자(Metacharacter) 또는 기호로 표현할 수 있다.
즉, 메타 문자와 추출하고 싶은 문자를 합친 것. 패턴의 양식에 따라 문자열에서 문자를 추출한다.

예)

const str = "abcd ab bc cd";
const regexr = /bc/g;

console.log(str.match(regexr));
//output [ 'bc', 'bc' ]

JS에서 정규식 사용

RegExp의 메소드

exec

RegExp.prototype.exec()
대응되는 문자열을 찾는 RegExp 메소드이다.
정보를 가지고 있는 배열을 반환한다.
대응되는 문자열을 찾지 못했다면 NULL을 반환한다.

const regex1 = RegExp('foo*', 'g');
const str1 = 'table football, foosball';
let array1;

while ((array1 = regex1.exec(str1)) !== null) {
  console.log(`Found ${array1[0]}. Next starts at ${regex1.lastIndex}.`);
  // expected output: "Found foo. Next starts at 9."
  // expected output: "Found foo. Next starts at 19."
}

flag를 g로 설정하면 regex1.lastIndex 가 변경되며 이 값의 위치부터 검색을 한다. 이러한 특징으로 반복문을 통해 여러 일치하는 항목을 찾을 수 있다.
flag 설정을 안하면 regex1.lastIndex 가 0으로 고정되어 맨 앞의 일치하는 값을 계속 찾아 무한 반복한다.

test

RegExp.prototype.test()
대응되는 문자열이 있는지 검사하는 RegExp 메소드이다.
true 또는 false를 반환한다.

const str = 'table football';

const regex = new RegExp('foo*');
const globalRegex = new RegExp('foo*', 'g');

console.log(regex.test(str));
// expected output: true

console.log(globalRegex.lastIndex);
// expected output: 0

console.log(globalRegex.test(str));
// expected output: true

console.log(globalRegex.lastIndex);
// expected output: 9

console.log(globalRegex.test(str));
// expected output: false

flag를 g로 설정하면 lastIndex 가 변경되며 이 값의 위치부터 문자열을 확인한다.
flag 설정을 안하면 lastIndex 가 0으로 고정된다.

String의 메소드

match

String.prototype.match()
대응되는 문자열을 찾는 String 메소드이다.
정보를 가지고 있는 배열을 반환한다.
대응되는 문자열을 찾지 못했다면 NULL을 반환한다.

const paragraph = 'The quick brown fox jumps over the lazy dog. It barked.';
const regex = /[A-Z]./g;
const found = paragraph.match(regex);

console.log(found);
// expected output: Array [ 'Th', 'It' ]

replace

String.prototype.replace()
대응되는 문자열을 찾아 다른 문자열로 치환하는 String 메소드이다.

const str = "this is a dog";

console.log(str.replace("dog", "monkey"));
// expected output: "this is a monkey"

const regex = /Dog/i;
console.log(str.replace(regex, "ferret"));
// expected output: "this is a ferret"

매개변수

replace(regexp, newSubstr)
replace(regexp, replacerFunction)

replace(substr, newSubstr)
replace(substr, replacerFunction)

자세히 : MDN Web Docs

String.prototype.search()
대응되는 문자열이 있는지 검사하는 String 메소드 이다.
대응된 부분의 인덱스를 반환한다.
대응되는 문자열을 찾지 못했다면 -1을 반환한다.

const paragraph = "abc. 123, 1a2b3c?";

// any character that is not a word character or whitespace
const regex = /[^\w\s]/g;

console.log(paragraph.search(regex));
// expected output: 3

console.log(regex.lastIndex);
// expected output: 0

console.log(paragraph[paragraph.search(regex)]);
// expected output: "."

g flag 를 사용해도 exec, test 처럼 lastIndex 값이 변경되지 않는다.

split

String.prototype.split()
정규식 혹은 문자열로 대상 문자열을 나누어 배열로 반환하는 String 메소드이다.

const names = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ; Chris Hand ";
const pattern = /\s*;\s*/;

const nameList = names.split(pattern);

console.log(nameList);
/* expected output:
[
  'Harry Trump',
  'Fred Barney',
  'Helen Rigby',
  'Bill Abel',
  'Chris Hand '
]
*/

names 문자열에서 /\s*;\s*/ 에 해당하는 문자열은 ' '; 로 ‘공백’ + ‘;’ 이다.
해당 문자열을 기준으로 나눠서 배열로 반환한 값이 nameList에 들어간다.

Regexr test site

Reference

https://poiemaweb.com/js-regexp
https://ko.wikipedia.org/wiki/%EC%A0%95%EA%B7%9C_%ED%91%9C%ED%98%84%EC%8B%9D#:~:text=%EC%A0%95%EA%B7%9C%20%ED%91%9C%ED%98%84%EC%8B%9D
https://hamait.tistory.com/342
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions
https://www.nextree.co.kr/p4327
https://tristan91.tistory.com/463

profile
gjeon
개발자 되기
이전 포스트

Rest parameters

0개의 댓글