javascript+es6

[ javascript ] 25. 정규표현식 ( 정규식 )

변쌤(이젠강남) 2024. 3. 13. 13:37
반응형

정규표현식 ( 정규식 )

 

정규 표현식(regular expression)이란?

정규 표현식(Regular Expression)은 문자열을 검색하거나 편집하는 데 사용되는 특수한 문자열 패턴입니다. 이것은 주어진 텍스트에서 원하는 패턴을 찾는 데 도움이 됩니다.

 

정규 표현식은 다양한 프로그래밍 언어와 텍스트 편집기에서 지원되며, 각 언어 및 편집기에서 약간의 차이가 있을 수 있지만 기본적인 패턴 매칭 및 문자열 검색에 대한 기능은 비슷합니다.

 

정규 표현식은 일반 문자와 특수 문자를 조합하여 표현되는데, 이들은 다음과 같은 역할을 합니다

 

 

일반 문자: 일반적인 문자열을 나타냅니다.

메타 문자: 패턴 매칭을 위해 특별히 사용되는 문자입니다. 예를 들어, "."은 어떤 문자와도 일치하고, "*"는 앞선 문자가 0번 이상 나타날 수 있다는 것을 의미합니다.

문자 클래스: 특정 유형의 문자와 일치시키기 위해 사용됩니다. "[0-9]"는 0부터 9까지의 숫자 중 하나와 일치합니다.

수량자: 이전 문자 또는 그룹이 얼마나 자주 나타나는지를 지정합니다. "*"는 0회 이상, "+"는 1회 이상, "?"는 0회 또는 1회 등을 나타냅니다.

그룹화: 패턴 일부를 그룹화하여 일치시키거나 추출할 수 있습니다. "("와 ")"로 그룹을 지정할 수 있습니다.

앵커: 문자열의 시작이나 끝과 일치하는 위치를 지정합니다. "^"는 문자열의 시작, "$"는 문자열의 끝을 나타냅니다.

 

 

- 문자 검색 (Search)

- 문자 대체 (Replace)

- 문자 추출 (Extract)

 

정규식을 만드는 방법

1. 슬래시(/)로 감싸는 정규식 리터널방식

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

 

방식1)
let regexp  = /Ezen/

방식2)
let regexp = new RegExp('Ezen')

 

 

정규식 함수 

정규식에서 제공하는 내장함수 

함수 설명
exec 정규식을 통해 찾고자 하는 문자열 패턴을 찾고 배열을 반환 
대응되는 문자열을 찾지 못하면 null을 반환
test 대응되는 문자열이 있는지 검사하고 있으면 true , 없으면 false를 반환
match 대응되는 문자열을 찾고 배열로 반환하는 String객체 내장함수 
대응되는 문자열이 없으면 null을 반환, exex()함수와 동일한 기능을 함
search 대응되는 문자열이 있는지 검사하고, 대응되는 첫 번째 문자열의 인덱스를 반환
대응되는 문자열이 없으면 -1을 반환
replace 대응되는 문자열을 찾고 다은 문자열로 치환하는 String 객체 내장함수
split 대응되는 문자열을 찾고, 문자열을 기준으로 나누어서 배열로 반환하는 String내장함수

 

 

let test = 'Hello World! world!';
const re = /World/;
console.log( re.test(str))
console.log( str.search(re))


//World에 대응되는 문자열을 찾는 패턴 정의
const re = /World/; 


//test()함수를 통해 대응되는 문자열이 있으면 true 반환
console.log( re.test(str))


//String 객체의 내장 함수인 search() 함수에 정규식을 적용해서 
대응되는 문자열이 발견되면 인덱스 번호를 반환
console.log( str.search(re))

 

 

정규식 특수문자

특수문자 설명
\ 정규식 특수 문자중 어떠한 경우에는 특수문자로서 동작하는것이 아니라 문자 그대로 일반문자로 인식되어야하는 경우 이를 구분하기 위해서 특수문자로 사용될수있는문자앞에 \가 있으면 특수문자가 아닌 일반문자로 이식하게 됩니다.  /A/ 패턴을 만들고  'hi A'에서 해당 정규식 패턴을 찾으면 A가 있기 때문에 대응되는 문자열 찾습니다. 
^ 입력의 시작 부분에 대응 
^다음의 내용으로 시작
 'hi A'에서 /^A/면 정규식 패턴의 대응되는 문자열을 잦지 못함 ^는 문자열의 시작을 의미하기 때문
'A Good'  : /^A/면 정규식 패턴의 대응
$ 입력의 끝부분에 대응 /t$/는 문자열이 t로 끝난다는 뜻
eat는 t로 끝나기 때문에 대응됩니다
{n} 앞 표현식이 n번 나타나는 부분에 대응 
n은 반드시 양의 정수 
/e{2}/는 green의  ee에 대응되고 
red는 e에 대응하지 않습니다. 
greeeeen은 e가 5개 이지만 처음 ee에 대응됩니다.
{n, m} n과 m은 양의 정수이고 
n <= m을 만족해야 합니다. 
앞 표현식이 최소 n개, 최대 m개가 나타나는 부분에 대응 됩니다.
/e{1,3}/ 은 e가 최소 1개 이상 최대 3개를 의미
red의  e에 대응되고 
green의 ee에 대응되고 greeeeen은 e가 5개 이지만 처음 eee에 대응 됩니다.
* * 앞의 표현식이 0회 이상 반복되는 부분과 대응
{0, }와 같은 의미 
/ez*/은 문자열에 e를 포함하고 e다음문자로 z가 0회 이상 즉 z가 없을수도 있고 있을수도 있다는 의미
문자열 boom의 b는 대응되고 
A bird 의  b에는 대응되지 않습니다.
+ + 앞의 표현식이 1회 이상 반복되는 부분과 대응
{1, } 와 같은 의미 
/ez+/은 문자열에 e를 포함하고 e다음문자로 z가 반드시 1회 이상 있어야 함 
/bo+/ 문자열 boom의 boo는 대응되고 
A bird 의  b에는 대응되지 않습니다.
? ? 앞의 표현식이 0 또는 1회 등장하는 부분과 대응
{ 0, 1 }과 같은 의미
/e?le/는 e가 없어도 되고 있다면 1회를 의미하기 때문에 결국 문자열에 I, el, ele, le를 포함하고 있는지 대응
angel 은 le가 대응되고
oslo 의 l이 대응 
. 단일문자에 대응 /.n/ 은 an apple 에서 an에 대응
(x) 괄호안에 패턴 전체에 적용 /foo{1,2}/는 마지막 o에만 {1,2}가 적용되어서 o가 최소 한번 최대 2번 나타나는것을 대응 
(?:x) 위 와 동일,  차이점은 대응되는 결과를 기억하지 않음  
x(?=y) x 뒤에 y가 뒤따라오는 경우에만 대응
이것을 lookahead라고 부릅니다.
/\ㅇ+(?=g)/ 는 숫자뒤에 g가 따라오는 경우에만 대응 
an apple is 200g 의 200에 대응 
x(?!y) x 뒤에 y가 없는 경우에만 대응 
이것을 negative lookahead라고 부릅니다.
 
x|y x 또는 y에 대응 /green|red/ 는 문자열 green 또는 red가 포함되어 있는지 대응 green apple  의 green에 대응되고 red apple의
red에 대응됩니다.
[xyz] 문자셋입니다. - 하이픈을 사용해서 문자의 범위지정 [a-d] 는 [ abcd ]와 똑같이 동작하면 문자열 a,b,c,d 중에 하나라도 있으면 대응 
red의  r에 대응 
[^xyz] 부정 문자셋, 패턴에 포함된 문자가 없는지와 대응
하이픈을 사용해서 문자의 범위를 지정할수 있음
[^a-d] 는 a,b,c,d 모두 없는지 대응
[\b] 백스ㅍ에이스에 대응  
\b 문자열에 있는 단어의 경계, 즉 시작 문자와 종료문자에 대응 /\bm/은 문자열의 단어 중에 m으로 시작하는 단어에 대응  moon의  m에 대응 
/oon\b/는 문자열의 단어 중에 oon으로 종료하는 단어에 대응 moon의 oon과 대응
\B 단어 경계가 아닌 부분에 대응  
\d 숫자 문자에 대응   [ 0 - 9 ]와 동일 /\d/ 는 ezen5에서 5에 대응
\D 숫자 아닌 문자에 대응   [ ^0 - 9 ]와 동일 /\D/ 는 ezen5에서 e에 대응

 

 

플래그

정규 표현식은 전역 탐색이나 대소문자 무시와 같은 특성을 지정하는 플래그를 가질 수 있습니다. 플래그는 단독으로 사용할 수도 있고, 순서에 상관 없이 한꺼번에 여럿을 지정할 수도 있습니다.

플래그설명대응하는 속성

d 부분 문자열 일치에 대해 인덱스 생성. RegExp.prototype.hasIndices (en-US)
g 전역 탐색. RegExp.prototype.global
i 대소문자를 구분하지 않음. RegExp.prototype.ignoreCase
m 여러 줄에 걸쳐 탐색. RegExp.prototype.multiline
s 개행 문자가 .과 일치함. RegExp.prototype.dotAll
u "unicode", 패턴을 유니코드 코드 포인트의 시퀀스로 간주함. RegExp.prototype.unicode (en-US)
y "접착" 탐색, 대상 문자열의 현재 위치에서 탐색을 시작함. sticky (en-US)를 참고하세요. RegExp.prototype.sticky (en-US)

 

 

 

패턴설명

^ab 줄(Line) 시작에 있는 ab와 일치
ab$ 줄(Line) 끝에 있는 ab와 일치
. 임의의 한 문자와 일치
a|b a 또는 b와 일치
ab? b가 없거나 b와 일치
{5} 5개 연속 일치
{5,} 5개 이상 연속 일치
{3,5} 3개 이상 5개 이하(3~5개) 연속 일치
[abc] a 또는 b 또는 c와 일치
[a-z] a부터 z 사이의 문자 구간에 일치 (영어 소문자)
[A-Z] A부터 Z 사이의 문자 구간에 일치 (영어 대문자)
[0-9] 0부터 9 사이의 문자 구간에 일치 (숫자)
[가-힣] 가부터 힣 사이의 문자 구간에 일치 (한글)
\w 63개 문자(Word, 대소영문52개 + 숫자10개 + _)에 일치
\b 63개 문자에 일치하지 않는 문자 경계(Boundary)
\d 숫자(Digit)에 일치
\s 공백(Space, Tab 등)에 일치
(?=) 앞쪽 일치 (Lookahead)
(?<=) 뒤쪽 일치 (Lookbehind)

 

 

  • **줄 시작(^)**과 **줄 끝($)**은 각각 문자열의 시작과 끝에서 특정 패턴을 찾는 데 사용됩니다.
  • **임의의 문자(.)**는 한 개의 임의의 문자와 일치합니다.
  • **선택(a|b)**은 a 또는 b 중 하나와 일치합니다.
  • **옵션(ab?)**은 b가 없거나 있을 때 모두 일치합니다.
  • **반복({n}, {n,}, {n,m})**은 반복되는 문자 패턴을 찾는 데 사용됩니다. {n}은 정확히 n번, {n,}은 n번 이상, {n,m}은 n번 이상 m번 이하의 반복을 의미합니다.
  • **문자 클래스([])**는 특정 문자 집합에 일치하는 패턴을 지정합니다. 예를 들어 [a-z]는 소문자 알파벳, [0-9]는 숫자와 일치합니다.
  • **특수 문자(\w, \b, \d, \s)**는 자주 사용하는 문자 유형을 나타냅니다. \w는 단어 문자(알파벳, 숫자, 언더스코어), \d는 숫자, \s는 공백을 의미합니다.
  • **전방 탐색과 후방 탐색((?=), (?<=))**은 특정 조건을 만족하는 위치를 찾는 데 사용됩니다. 전방 탐색은 조건에 맞는 부분이 뒤에 있는지 확인하고, 후방 탐색은 조건에 맞는 부분이 앞에 있는지 확인합니다.

 

 

 

const re = new RegExp("pattern", "flags");

 

const regex = /foo/g;
console.log(regex.global); // true

const str = "fooexamplefoo";
const str1 = str.replace(regex, "");
console.log(str1); // example

const regex1 = /foo/;
const str2 = str.replace(regex1, "");
console.log(str2); // examplefoo

 

 

const re = /\w+\s/g;
const str = "fee fi fo fum";
const myArray = str.match(re);
console.log(myArray);

// ["fee ", "fi ", "fo "]
const re = /\w+\s/g;

 

const regex1 = new RegExp('foo', 'g');

console.log(regex1.global);
// Expected output: true

const regex2 = new RegExp('bar', 'i');

console.log(regex2.global);
// Expected output: false

 

 

 

 

 

전화번호 정규식

// 사용자로부터 입력받은 휴대폰 전화번호
const tel1 = '010-1122-345구';
const tel2 = '010-1122-3456';

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

// 휴대폰 전화번호 패턴에 매칭하는지 테스트(확인)
let x = regExp.test(tel1); // -> false
let y = regExp.test(tel2); // -> true

console.log(x); // false
console.log(y); // true

 

 

전화번호 정규식

핸드폰번호 정규식
let regExp = /^\d{3}-\d{3,4}-\d{4}$/;


일반 전화번호 정규식
let regExp = /^\d{2,3}-\d{3,4}-\d{4}$/;

 

 

 

이메일 정규식

regExp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;

/ 안에 있는 내용은 정규표현식 검증에 사용되는 패턴 / 
대소문자를 구분하지 않도록 i를 사용
^ 처음시작하는 부분부터 일치
[0-9a-zA-Z] 하나의 문자가 []안에 위치한 규칙을 따른다는 것으로 숫자와 알파벳 소문지 대문자인 경우를 뜻 함
* 이 기호는 0또는 그 이상의 문자가 연속될수 있음

 

 

 

 

반응형