Regular_Expressions 정규표현식

이주희·2022년 4월 17일
0

JavaScript

목록 보기
21/49

Regular_Expressions

정규표현식 = 정규식

  • 원하는 패턴에 일치하는 내용이 존재하는지 검증한다.

  • 문자열 데이터가 현재 페이지에 적합한 용도로 사용되는지 체크하는데 유용한 JS 기능이다.

  • String의 match(), matchAll(), replace(), replaceAll(), search(), split() 메서드를 사용할 수 있다.

사용 방법

생성자 함수를 사용하면 정규 표현식이 런타임에 컴파일된다.
바뀔 수 있는 패턴이나, 사용자 입력 등 외부 출처에서 가져오는 패턴의 경우 이렇게 사용한다.

const re = new RegExp('ab+c')

메서드

  • test
    /조건/.test("검증할문자열") : true / false를 반환한다.

  • match
    "검증할문자열".match(정규식) : 일치하는 문자열의 배열을 반환한다.

  • replace
    "검증할문자열".replace(정규식, 대체할문자열) : 일치하는 문자열을 대체하고, 대체된 결과를 반환한다.

1. 이스케이핑

  • \: 특수문자를 있는 그대로 탐색(특수문자가 아닌 문자 리터럴로 취급)
  • RegExp 생성자에 문자열을 넣어서 사용하는 경우, 역슬래시도 이스케이프 해줘야 한다.
    /a\*b/ 패턴을 생성하려면 👉🏻 new RegExp("a\\*b")

2. 플래그

  • g : 전체 문자열을 탐색해서 모든 일치 반환
  • i : 대소문자 무시
  • m : 여러 줄 매칭
  • ^ : 부정
/* i */
const re = /a/i // 대소문자 구분 없이 a가 있는 문자

/* ^ */
const re = /[^a-z]/  // a~z가 아닌 문자

3. Assertions 어서션

시작과 끝을 정해주지 않으면, 조건의 내용이 어딘가에 포함만 되어있으면 true가 나온다.

  • ^ : 시작
  • $ : 끝
  • \b : boundary 문자와 공백 사이의 문자
  • \B : 문자와 공백 사이가 아닌 문자

4. Quantifiers 수량자

  • ?: 0개 또는 1개
  • *: 0개 이상
  • + : 1개 이상
  • {자릿수}: 반복 횟수
    👉🏻 {3,4}: 3자리 또는 4자리
/\w@a.com/.test("aaaa@a.com") // true
/^\w@a.com$/.test("dddd@a.com") // false : @ 전에 글자수가 하나가 아니라서 false
/^\w+@a.com$/.test("aaaa@a.com") // true
/^\w?@a.com$/.test("aaaa@a.com") // false
/^\w*@a.com$/.test("aaaa@a.com") // true

5. Character classes 문자 클래스

  • . : 1개의 모든 문자(.을 의미하고 싶다면 👉🏻 \. )
  • \w: 알파벳, 숫자로 된 문자, 밑줄 기호() [A-Za-z0-9]
  • \W: w의 반대 [^A-Za-z0-9_]
  • \s : 공백(스페이스, 탭, 폼 피드, 라인 피드)
  • \d : 숫자
  • \D : 숫자가 아닌 문자 [^0-9]
  • [a-zA-Z] : 문자만
/* . */
/^\w*@\w+.\w+$/.test("aaaa@a?com") // true
/^\w*@\w+\.\w+$/.test("aaaa@a?com") //false

핸드폰 번호

/^\d{3}-\d{3,4}-\d{4}$/.test("010-1234-5678")
profile
🍓e-juhee.tistory.com 👈🏻 이사중

0개의 댓글