티스토리 뷰

참고 : developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions

 

정규 표현식 - JavaScript | MDN

정규 표현식 정규 표현식은 문자열에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴입니다. 자바스크립트에서, 정규 표현식 또한 객체입니다.  이 패턴들은 RegExp의 exec 메소드와 tes

developer.mozilla.org


정규 표현식 기본 패턴
/포함돼야할 문자/
  • /abc/
문자열에서 정확히 'abc' 라는 문자들이 모두 함께 순서대로 나타나야 대응
abcde (o), bcde (x)

 

정규 표현식에 사용되는 패턴, 표현들 (가독성이 떨어져서 추후에 표형식으로 바꿀 예정...)
  • 특수 문자 
  • \(역슬래쉬)
특수 문자를 포함 문자로 해석 (\도 하나만 적으면 효과 없음)
/a\\*/ : a* 문자 포함 >> arrow (x), a*b (o)
  • ^
입력의 시작부분, 줄바꿈 뒤의 첫 부분
/^A/ : 첫 글자가 A인 것 >> Apple (o), pineApple (x)
  • $
입력의 끝부분, 줄바꿈 전의 마지막 부분
/t$/ : t로 끝나는 것  >> let (o), lte (x)
  • *
* 앞의 문자가 0회이상 반복되는 것
/lo*/ : l이나 lo가 0회 이상 나오는 것  >> love (o), life (o), omg (x)
  • +
+ 앞의 문자가 1회이상 연속 반복되는 것
/a+/ : a가 1번 이상 나오는 것 >> candy (o), caaandy (o), cndy (x)
  • ?
앞의 표현식이 0회나 1회 포함, 특수문자 뒤에 쓰면 해당 문자의 특성에 맞는 결과를 1개 반환
(lookahead assertion_사전검증 위함)
/e?le?/ e나 le나 l이 포함
123abc를 /\d+/에 적용 (\d : 숫자에 대응) 결과 >> 123
123abc를 /\d+?/에 적용 결과 >> 1
  • . (온점)
개행 문자(줄바꿈 문자)제외 모든 단일 문자와 대응
"nay, an apple is on the tree"를 /.n/에 적용 결과 : 'an' (o), 'on' (o), 'nay'(x)
  • 괄호
  • (x)
'x'에 대응, 그것을 기억  괄호는 포획 괄호(capturing parentheses)라 불림
"foo bar foo bar"를 /(foo) (bar) \1 \2/에 적용 결과 : 처음의 두 단어에 대응되고 이를 기억
  • (?:x)
x'에 대응되지만 대응된 것을 기억하지 않음 괄호는 비포획 괄호(non-capturing parentheses)라고 불림
비포획 괄호의 역할 : 정규식 연산자가 같이 동작할 수 있게 하위 표현을 정의
/(?:foo){1,2}/ >> {1,2}는 'foo'의 마지막 'o' 에만 적용
/(?:foo){1,2}/ >> {1,2}는 단어 'foo' 전체에 적용
  • x(?=y)
오직 'y'가 뒤따라오는 'x'에만 대응
/Jack(?=Sprat)/ >> 'Sprat'가 뒤따라오는 'Jack' 에만 대응
/Jack(?=Sprat|Frost)/ >> 'Sprat' 또는 'Frost'가 뒤따라오는 'Jack'에만 대응
  • x(?!y)
'x'뒤에  'y'가 없는경우에만 'x'에 일치
/\d+(?!\.)/ >> 소숫점이 뒤따라오지 않는 숫자에 일치
"3.141"을 /\d+(?!\.)/에 적용 : 141에 일치
  • x|y
x' 또는 'y'에 대응
/green|red/ >> 문장 중 green 또는 red 가 포함
  • {n}
앞 표현식이 n번 나타나는 부분에 대응 (n은 반드시 양의 정수)
/a{2}/ >> caandy (o), caaaandy (o), candy (x)
  • {n, m}
n m은 양의 정수이고, n <= m를 만족(앞의 문자가 최소 n개, 최대 m개). m이 생략시 m은 ∞로 취급
/a{1,3}/ >> caandy : aa가 대응, caaaaaaaaandy : aaa까지만 대응
  • [xyz] : 문자셋
괄호 안의 어떤 문자와도 대응, -(하이픈)을 이용하여 문자의 범위를 지정,  .(온점),* 같은 특수 문자는 문자셋 내부에서 글자로 취급
[a-d] ( = [abcd] ) >> brisket (o) , city (o), phone (x)
/[a-z.]+/ >> test.i.ng 전체 문자열이 일치
  • [^xyz] : 부정 문자셋, 보충문자셋

 

괄호 내부에 등장하지 않는 문자와 대응,  하이픈을 이용하여 문자의 범위를 지정
[^a-c] >> brisket : r과 일치, chop : h와 일치
  • [\b]
backspace에 대응

 

  • \문자 (일부 \문자 형식은 표에 안넣음)
\문자 설명 예시
\b  다른 '단어 문자'가 앞이나 뒤에 등장하지 않는 위치에 대응
(단어의 경계는 대응 결과에 포함되지 않음)
"moon"를 적용한다면...
▶/\bm/
'm'에 대응
/oo\b/ 'oo' 부분에 대응x , 'oo'를 뒤 'n'이 단어 문자니까
/oon\b/ "'oon'에 대응.'oon'은 문자열의 끝이라, 뒤따라오는 단어 문자가 없음
/\w\b\w/ 어떤 것에도 일치 x. 단어 문자는 절대로 비 단어 문자와 단어 문자 두개가 뒤따라올수 없기 때문.
\B 단어 경계가 아닌 부분에 대응
(문자열의 시작 부분과 끝 부분은 단어가 아닌 것으로 간주)
  • 문자열의 첫 번째 문자가 단어 문자가 아닌 경우, 해당 문자의 앞 부분에 대응
  • 문자열의 마지막 문자가 단어 문자가 아닌 경우, 해당 문자의 뒷 부분에 대응
  • 두 단어 문자의 사이에 대응
  • 단어 문자가 아닌 두 문자 사이에 대응
  • 빈 문자열에 대응
/\B../ "noonday"의 'oo'와 대응

/y\B./  "possibly yesterday."의 'ye'와 대응
\d 숫자 문자에 대응
[0-9]와 동일
/\d/ "B2 is the suite number."의 '2'에 대응
\D 숫자 문자가 아닌 문자에 대응[^0-9]와 동일 /\D/ "B2 is the suite number."의 'B'에 대응
\n 줄 바꿈 문자에 대응
\s 스페이스, 탭, 폼피드, 줄 바꿈 문자등을 포함한 하나의 공백 문자에 대응 /\s\w*/는 "foo bar."의 ' bar'에 대응
\S 공백 문자가 아닌 하나의 문자에 대응 /\S\w*/는 "foo bar."의 'foo' 에 대응
\t 탭 문자에 대응
\w 밑줄 문자를 포함한 영숫자 문자에 대응
 [A-Za-z0-9_] 와 동일
/\w/는...
"apple,"의 'a' 에 대응
$5.28,"의 '5'에 대응
3D."의 '3'에 대응
\W 단어 문자가 아닌 문자에 대응[^A-Za-z0-9_] 와 동일 /\W/ "50%."의 '%' 에 대응
\0 null문자에 대응
(다른 숫자를 뒤에 쓰지않도록 주의)

 

  • 정규식 제공 함수
함수명 설명 반환 타입
exec 대응되는 문자열을 찾는 RegExp 메소드.  정보를 가지고 있는 배열 반환
문자열을 찾지 못했다면 null을 반환
match 대응되는 문자열을 찾는 RegExp 메소드 정보를 가지고 있는 배열 반환
문자열을 찾지 못했다면 null을 반환
test 대응되는 문자열이 있는지 검사하는 RegExp 메소드 대응되면 true, 없으면 false를 반환
search 대응되는 문자열이 있는지 검사하는 String 메소드 대응된 부분의 인덱스를 반환
대응되는 문자열을 찾지 못했다면 -1 반환
replace 대응되는 문자열을 찾아 다른 문자열로 치환하는 String 메소드 치환한 문자열을 반환
split 정규식 혹은 문자열로 대상 문자열을 나누어 배열로 반환하는 String 메소드 배열로 반환

TIP) 문자열 내부에 패턴과 대응되는 부분이 있는지 알고 싶다면, test 나 search 메소드를 사용

많은 정보를 원할 시 exec 나 match 메소드를 사용. 이 때 대응되는 부분이 있다면, 배열을 반환하고 정규식 객체의 속성을 업데이트 함

 

활용 예시

let myRe = /d(b+)d/g;
let myArray = myRe.exec("cdbbdbsbz");

주의!

정규식을 변수로 만들지 않고 직접 써버리면, 한번 더 호출 시 해당 정규식에 접근하지 못한다고 한다.

정규식 썼는데 다른 결과가 나온다면 이런 이유일 확률이 높다.

// 1. 변수에 담아 사용 시 2번 호출 결과
let myRe = /d(b+)d/g;
let myArray = myRe.exec("cdbbdbsbz");
console.log("The value of lastIndex is " + myRe.lastIndex);

// "The value of lastIndex is 5" 라고 출력됨

/*********************실제로는 다른 파일이라 가정*********************/

// 2. 변수에 담지않고 바로 적었을 때

let myArray = /d(b+)d/g.exec("cdbbdbsbz");	// 1번 호출
console.log("The value of lastIndex is " + /d(b+)d/g.lastIndex);	// 2번 호출

// "The value of lastIndex is 0" 이라고 출력됨
// console.log에서 정규식을 한번 더 호출했기 때문에 console에 정확한 결과가 나오지 않음

문자열로부터 정규식을 만드는 법

let myRe = new RegExp("d(b+)d", "g");
let myArray = myRe.exec("cdbbdbsbz");

 

  • 플래그 설정 (총 6개인데 y라는건 (내가)안쓸거같아서 뺐음)
플래그 설명
g 전역 검색
i 대소문자 구분 없는 검색
m 다중행(multi-line) 검색
s .에 개행 문자도 매칭
u 유니코드. 패턴을 유니코드 코드 포인트의 나열로 취급

플래그 생성 예시

// 방법 1. 변수에 바로 적용
let re = /패턴/플래그;

// 방법 2. 생성자를 통한 생성
let re = new RegExp("패턴", "플래그");

사용 예시

 한 개 이상의 문자열 뒤에 공백이 하나 있는 패턴을 찾는 정규식을 생성한 후 문자열에서 이 조합을 검색함

// 정규식 생성
let re = /\w+\s/g; // 또는 let re = new RegExp("\\w+\\s", "g");

// 검사할 문자
let str = "fee fi fo fum";

// 검사할 문자(str)를 match함수를 통해 정규식(re)조건에 해당하는 값을 myArray에 담아줌
let myArray = str.match(re);

console.log(myArray);
// 출력 결과 : ["fee ", "fi ", "fo "]

match()대신 exec()를 사용할 때에는 'g' 플래그에 대한 동작이 다름.  "클래스"와 "인수"의 역할이 뒤바뀐다고 함

그리고 'g' 플래그와  .exec() 메소드가 함께 사용되면 진행상황에 대한 정보가 반환됨

// 정규식 생성
let re = /\w+\s/g; // 또는 let re = new RegExp("\\w+\\s", "g");

// 검사할 문자
let str = "fee fi fo fum";

// 검사할 문자(str)를 match함수를 통해 정규식(re)조건에 해당하는 값을 myArray에 담아줌
let myArray = re.exec(str);	//str.match(re) -> re.exec(str)로해야 돌일 결과 나옴


// g플래그와 exec()를 함께 사용하면 진행상황에 대한 정보가 반영됨
let xArray; while(xArray = re.exec(str)) console.log(xArray);
// 출력 결과
// ["fee ", index: 0, input: "fee fi fo fum"]
// ["fi ", index: 4, input: "fee fi fo fum"]
// ["fo ", index: 7, input: "fee fi fo fum"]

 

m 플래그는 여러 줄의 입력 문자열이 실제로 여러 줄로서 다뤄져야 하는 경우에 쓰임. m플래그가 ^  $ 문자랑 같이 쓴다면 전체 문자열의 시작과 끝에 대응되는 것이 아니라 각 라인의 시작과 끝에 대응됨

 


자주 쓰이는 정규식 패턴 (출처: https://highcode.tistory.com/6 [HighCode])

  •  숫자만 허용: /^[0-9]*$/
  • 영문자만 허용: /^[a-zA-Z]*$/
  • 한글만 허용: /^[가-힣]*$/
  • 영어 & 숫자만 허용: /^[a-zA-Z0-9]*$/
  • E-Mail : /^[a-zA-Z0-9]+@[a-zA-Z0-9]+$/
  • 휴대폰 : /^01(?:0|1|[6-9]) - (?:\d{3}|\d{4}) - \d{4}$/
  • 일반전화 : /^\d{2,3} - \d{3,4} - \d{4}$/
  • 주민등록번호 : /\d{6} \- [1-4]\d{6}/
  • IP 주소 : /([0-9]{1,3}) \. ([0-9]{1,3}) \. ([0-9]{1,3}) \. ([0-9]{1,3})/




반응형
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함