[TIL#8] Java Script 정규 표현식

이트루·2024년 1월 7일
0

🌵TIL

목록 보기
8/17

[머리말]
String 객체의 메서드 중 replace 등에서 첫 번째 인자를 문자열이 아니라 정규 표현식 형태로 줄 수 있다는 것을 알게 되었다. 따라서 이 게시글에서는 MDN 문서를 참조하여 정규 표현식에 대해 알아보고자 한다.

[추가]

정규 표현식은 String의 match(), matchAll(), replace(), replaceAll(), search(), split() 메서드와도 함께 사용할 수 있습니다.
- MDN web docs -


String Object의 속성 및 method와 정규 표현식

String 형 식별자, 즉 String 객체에서 자주 쓰이는 속성/메서드에는 여러가지가 존재한다.

예를 들면 length, includes, replace, replaceAll, split, substring, toLowerCase, toUpperCase, trim , ... 등등이 존재한다.

string을 다룰 때, 특정한 패턴을 바탕으로 string object를 처리하고 싶을 때가 있을 것이다. 이럴 때 유용하게 사용될 수 있는 것이 바로 '정규 표현식(정규식)'이다.

정규 표현식은 문자열에서 특정 문자 조합을 찾기 위한 패턴으로, Java Script에서는 정규 표현식도 객체로 취급한다고 한다. 이 말은 즉슨 객체 생성자를 호출하여 정규 표현식을 만들 수 있다는 말이고, 정규 표현식에 대한 메서드가 존재한다는 뜻이다.

정규 표현식을 만드는 2가지 방법

정규 표현식을 만드는 방법은 2가지가 존재한다.

  1. 정규 표현식 리터럴
  2. : 패턴의 양 끝을 슬래시('/')로 감싸 작성한다. 이는 스크립트를 불러올 때 컴파일 되므로, 바뀔 일이 없는 패턴의 경우에 리터럴을 사용하면 성능이 향상될 수 있다. Ex) const re = /ab+c/;
  3. RegExp 객체의 생성자 호출
  4. : 생성자 함수를 사용하면 정규 표현식이 런타임에 컴파일 된다. 따라서 바뀔 수 있는 패턴이나, 사용자 입력 등 외부에서 가져오는 패턴의 경우에는 정규 표현식을 생성자로 만드는 것을 권장한다.
    Ex) const re = new RegExp("ab+c");

정규 표현식의 패턴을 작성하는 방법

그럼 패턴을 어떻게 구성할 수 있을까? 단순한 패턴으로 구성하는 방법도 있고, 특수 문자를 사용해서 패턴을 구성할 수도 있다.

  1. 단순 패턴 사용
  2. : /abc/ 와 같은 패턴은, 문자열에서 정확한 순서로 "abc" 문자의 조합을 의미한다. 중간에 공백이 있는 "ab c"에 대해서는 패턴 매칭에 실패하게 된다.
  3. 특수 문자 사용
  4. : 하나 이상의 특정 문자나 공백 문자를 찾는 등, 직접적인 일치 이상의 탐색이 필요할 때 특수 문자를 사용한다. 예를 들어 '하나의 'a' 이후에 0개 이상의 'b', 그 뒤의 'c''와 일치하는 것을 찾고 싶다면, /ab*c/ 패턴으로 매칭할 수 있다.

그럼 특수 문자를 사용하여 패턴 매칭을 할 때 사용되는 다양한 특수 문자를 알아보자. 참고로, 정규 표현식에서의 'word(단어)'는 한글과 같은 2byte 문자를 포함하지 않기 때문에, \b로 처리할 수 없다.

1. Assertion

Assertions include boundaries, which indicate the beginnings and endings of lines and words, and other patterns indicating in some way that a match is possible (including look-ahead, look-behind, and conditional expressions).

  • ^ : 입력의 beginning과 matche한다. /^A/와 같이 사용한다.
    [주의] character class에서의 ^는 제외의 의미를 가진다. (Ex. [^xyz]_
  • $ : 입력의 end와 match한다. /t$/와 같이 사용한다.
  • \b : b는 boundary를 위미하며, 단어 사이(띄어쓰기 기준) 의 경계를 의미한다.
    |Raindrops| |on| |roses|, |and| |whiskers| |on| |kittens|. 에서 |를 표시한 위치를 가리킨다.
  • \B : \b와 반대로 동작한다.
    R|a|i|n|d|r|o|p|s o|n r|o|s|e|s, a|n|d w|h|i|s|k|e|r|s o|n k|i|t|t|e|n|s. 에서 |를 표시한 위치를 가리킨다.
  • x(?=y) : x 다음에 y가 오는 경우에만 x를 match 한다. match result에는 y가 포함되지 않는다.
  • x(?!y) : x 다음에 y가 오지 않는 경우에만 x를 match 한다.
  • (?<=y)x : x 앞에 y가 오는 경우에만 x를 match 한다.
  • (?<!y)x : x 앞에 y가 오지 않는 경우에만 x를 match 한다.

2. Character Classes

Character classes distinguish kinds of characters such as, for example, distinguishing between letters and digits.

  • [^xyz] : x, y, z를 제외한 이후에 나오는 첫 문자와 match된다.
  • [xyz] : x, y, z 에 해당하는 문자와 match된다.
  • \d : [0-9]와 동일한 의미를 가진다.
  • \D : \d와 반대의 의미인 [^0-9]를 의미한다.
  • . : line terminators(\n, \r, \u2028 or \u2029)를 제외한 모든 single character와 match한다.
  • \w : underscore('') 를 포함하여 영숫자(alphanumeric) character와 match한다. [A-Za-z0-9]와 동일한 의미이다.
  • \W : \w와 반대의 의미인 [^A-Za-z0-9_]를 뜻한다.
  • \s : single white space character를 의미한다. (space, tab, form feed, line feed, unicode spaces를 포함한다.) [\f\n\r\t\v\u0020\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff] 와 동일한 의미이다.
  • \S : \s와 반대의 의미인 [^\f\n\r\t\v\u0020\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff] 를 뜻한다.
  • \t : 수평 탭과 match 된다.
  • \r : carrige return과 match 된다.
  • \n : linefeed(enter)와 match 된다.
  • \v : 수직 탭과 match 된다.
  • \f : form-feed와 match 된다.
  • [\b] : backspace와 match 된다.
  • \0 : NULL과 match 된다. (Do not follow this with another digit.)
  • \ : 이 뒤에 나타나는 character가 should be treated specially, or "escaped" 임을 나타낸다.

3. Quantifiers

Quantifiers indicate numbers of characters or expressions to match.

  • x* : x가 0번 이상 반복 되는 것을 match한다.
  • x+ : x가 1번 이상 반복 되는 것과 match한다. {1,}과 동일한 의미를 가진다.
  • x? : x가 0번 또는 1번 나타나는 것과 march 한다.
  • x{n} : n이 양의 정수일 때, x가 정확히 n번 나타나는 것과 match한다.
  • x{n,} : n의 양의 정수일 때, x가 최소 n번 나타나는 것과 match한다.
  • x{n,m} : n이 0 또는 양의 정수이고, m이 양의 정수이며 m>n을 만족할 때, x가 최소 n 이상 m 이하 나타나는 것을 match한다.
  • 위의 특수 문자 뒤의? : By default quantifiers like * and + are "greedy", meaning that they try to match as much of the string as possible. The ? character after the quantifier makes the quantifier "non-greedy": meaning that it will stop as soon as it finds a match.
    (MDN 문서의 내용이며, 영어로 이해하는 것이 좋을 것 같아 번역하지 않았습니다.)

위에서 설명한 것 이외에 추가적인 특수 문자가 궁금하다면 MDN 문서에서 직접 확인해보자.

혹시나 이해가 안되는 부분이 있다면, 직접 작성하며 경험해보는 것이 가장 좋은 방법이다. 직접 하나씩 타이핑 해보며 각 의미를 이해하도록 하자.


[참고 문헌]

profile
내 꿈은 세계정복🧐

1개의 댓글

comment-user-thumbnail
2024년 1월 8일

자주 쓰이는 정규 표현식 패턴 - https://uznam8x.tistory.com/62
정규 표현식 플레이그라운드 - https://regexr.com/

이런 곳도 참고해보세요!
(소곤소곤) 사실 이건 AI한테 물어보면 엄청 대답 잘 해줍니다:)

답글 달기