모던 자바스크립트 Deep Dive - 31장 RegExp

송히·2023년 11월 13일
0
post-thumbnail

31 RegExp

31.1 정규 표현식이란?

  • 정규 표현식: 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어
    -> JS의 고유 문법이 아니고, 대부분의 프로그래밍 언어와 코드에디터에 내장되어 있음

  • 정규 표현식은 문자열을 대상으로 패턴 매칭 기능을 제공함
    -> 패턴 매칭 기능: 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능

  • 반복문과 조건문 없이 패턴을 정의하고 테스트하는 것으로 간단히 쳬크할 수 있지만, 주석이나 공백을 허용하지 않고 가독성이 좋지 않음

31.2 정규 표현식의 생성

  • 정규 표현식 리터럴: 일반적인 정규 표현식 객체 생성 방법
    -> 패턴과 플래그로 구성됨

  • RegExp 생성자 함수: 변수를 사용해 동적으로 RegExp 객쳬를 생성 가능

/* pattern: 정규 표현식의 패턴 
* flags= 정규 표현식의 플래그(g, i, m, u, y)
*/ 

new RegExp(pattern[, flags])  

31.3 RegExp 메서드

31.3.1 RegExp.prototype.exec

  • 인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 배열로 반환 (없는 경우 null 반환)

  • 문자열 내의 모든 패턴을 검색하는 /g를 써도 첫 번째 매칭 결과만 반환함

31.3.2 RegExp.prototype.test

  • 인수로 전달받은 문자열에 대해 정규 표현식의 패턴을 검색하여 매칭 결과를 불리언 값으로 반환

31.3.3 String.prototype.match

  • 대상 문자열과 인수로 전달받은 정규 표현식의 매칭 결과를 배열로 반환

31.4 플래그

  • 총 6개, 아래 3개는 중요함

  • 플래그는 옵션이므로 선택적 사용 가능, 순서와 상관없이 하나 이상의 플래그를 동시에 설정 가능

31.5 패턴

  • 패턴: 문자열의 일정한 규칙을 표현하기 위해 사용
    -> /로 열고 닫으며 따옴표는 생략(포함하면 따옴표까지 패턴에 포함되어 검색됨)
    -> 특별한 의미를 가지는 메타문자 또는 기호로 표현 가능

  • 플래그: 정규 표현식의 검색 방식을 설정하기 위해 사용

31.5.1 문자열 검색

  • 정규 표현식의 패턴에 문자 또는 문자열을 지정하면 검색 대상 문자열에서 패턴으로 지정한 문자 또는 문자열을 검색 가능
    -> 메서드를 사용하여 검색 대상문자열과 정규 표현식의 매칭 결과를 구하면 검색이 수행됨

31.5.2 임의의 문자열 검색

  • .은 임의의 문자 한 개를 의미 (내용은 상관 없음)
    => 자릿수만 보는 것(공백도 포함)

31.5.3 반복 검색

  • {m, n}은 앞선 패턴이 최소 m번, 최대 n번 반복되는 문자열을 의미(콤마 뒤에 공백이 있으면 정상 동작하지 않음)
const target = 'A AA B BB Aa Bb AAA' ; 
// 'A ' 가 최소 n번, 최대 m번 반복되는 문자열을 전역 검색
const regExp = /A{1,2}/g; 

target.match(regExp);
  • {n}은 앞선 패턴이 n번 반복됨
  • {n, }은 앞선 패턴이 최소 n번 이상 반복됨
  • +는 앞선 패턴이 최소 한번 이상 반복됨
  • ?는 앞선 패턴이 최대 한 번(0번 포함) 이상 반복됨

31.5.4 OR 검색

  • |은 or의 의미를 가짐
  • 분해되지 않은 단어 레벨로 검색하기 위해서는 +를 함께 사용

31.5.5 NOT 검색

  • [...] 내의 ^은 not의 의미

31.5.6 시작 위치로 검색

  • [...] 밖의 ^은 문자열의 시작을 의미

31.5.7 마지막 위치로 검색

  • $는 문자열의 마지막을 의미

31.6 자주 사용하는 정규표현식

31.6.1 특정 단어로 시작하는 검색

const url = 'https://example.com'; 

// 'http://' 또는 'http://'로 시작하는지 검사 
/^https?:\/\//.test(url); // true 

31.6.2 특정 단어로 끝나는지 검사

const fileName = 'index.html'; 
/html$/.test(fileName); // true

31.6.3 숫자로만 이루어진 문자열인지 검사

const target = '12345';
/^\d+$/.test(target); // true

31.6.4 하나 이상의 공백으로 시작하는지 검사

const target = ' Hi!';

/^[\s]+/.test(target); // true

31.6.5 아이디로 사용 가능한지 검사

모던 자바스크립트 도서 590p 참고

31.6.6 메일 주소 형식에 맞는지 검사

모던 자바스크립트 도서 590p 참고

31.6.7 핸드폰 번호 형식에 맞는지 검사

모던 자바스크립트 도서 591p 참고

31.6.8 특수 문자 포함 여부 검사

모던 자바스크립트 도서 591p 참고

profile
데브코스 프론트엔드 5기

0개의 댓글