정규표현식이란?

해당 Post는 정규표현식에 대해서 정리한 파일입니다.

회원가입을 할 때 이메일이나 전화번호 등을 입력하는 경우가 있습니다.

이때 입력한 값이 올바르지 않으면 에러 메시지가 나오는 경험을 했을 겁니다.

입력값이 올바른지 자바스크립트로 간단히 체크할 수 있는 방법이 있습니다.


정규표현식 (regular expression)

CSS 쿼리에서 나와있는 것처럼 어떠한 정해진 패턴, 규칙이 있습니다.

그런 것들을 따라서 정규 표현식도 비슷한 식으로 이곳에 제공되는 문법들이 있습니다.

패턴을 찾아서 추출, 삭제, 치환 등의 문자열 조작을 할 수 있습니다.

문자열의 특정 패턴을 찾을 수 있는 문법입니다.

### 예를 들어서

abcd로 쭉 이어진 z까지 문자열이 있을 때 그 사이에 실수로 숫자가 한 가지 들어갔다면?

그래서 그 숫자를 찾아서 삭제하는 그런 것들을 만들 수가 있습니다.

그럴 때 정규 표현식을 쓰면 쉽게 숫자를 찾고 그 부분을 치환하거나 없앨 수가 있습니다.

만약 정규 표현식이 없다면?

문자를 문자 단위로 이렇게 for 문을 돌면서, 루프를 돌면서 처리할 수도 있을 겁니다.

하지만 정규 표현식은 코딩을 해야 되는 코드 양을 획기적으로 줄여줄 수가 있고 좀 더 빠르게 문자열 조작을 할 수 있게 도와주는 문법입니다.

몇 가지 유용한 사례 입니다.

  • 이메일, 주소, 전화번호 규칙 검증
  • textarea에 입력된 것 중 불필요한 입력값 추출
  • 트랜스파일링
  • 개발 도구에서의 문자열 치환

트랜스 파일링 : 최근에 자바스크립트 개발이 ECMA 스크립트가 6, 7, 8로 나아가면서
현대화된 개발 문법을 브라우저가 지원되지 않기 때문에 그 문법을 변환시켜주는 어떤 로그들을 만들 필요가 있습니다.
그 도구에서 예를 들어서 이런 걸, 최근 문법에 쓴 개발 코드가 있는데 그 코드를 실제 브라우저에서 동작 가능한 코드로 변경한다거나
그런 작업을 할 때, 즉 소스코드를 읽어들여서 그 부분에 어떤 문법을 현재 지원되는 문법으로 변환해야 되는 그런 경우

간단한 사용법

  • 숫자 하나 찾기
var result = "abc3zzz".match(/\d/)[0];

console.log(result);
  • 숫자 두 개 찾기
var result = "abc32zzz".match(/\d\d/)[0];

console.log(result);