정리하는 이유
실무에서 사용하거나 알고리즘 테스트를 볼 때, 매번 정규표현식 사용법을 까먹어서 다시 구글링을 하는 경우가 많습니다.
정규표현식 사용법을 찾기 위한 시간적인 비용을 줄이기 위해 자주 사용되는 패턴을 정리해보았습니다.
정규표현식의 정의
일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어 (formal language).
위의 정의는 표현이 어렵게 되어 있는데, 쉽게 말해서 문자열에서 특정 패턴을 찾아서 검색, 치환 등의 작업을 처리할 수 있는 방법이라고 생각하면 될 것 같습니다.
정규표현식과 관련된 자바스크립트 Prototype 메서드
1. RegExp.prototype.xxx
- exec : 패턴에 매칭되는 문자들을 배열로 반환, 매칭하지 않으면 null 반환
- test : 패턴에 매칭하면 true, 아니면 false 반환
2. String.prototype.xxx
- match : 패턴에 매칭되는 문자들을 배열로 반환, 매칭하지 않으면 null 반환
- replace : 패턴에 매칭되는 문자를 특정 문자로 치환할 수 있음, 치환된 문자열을 반환
정규표현식에서 사용하는 메타 문자
정규표현식에서는 특정한 의미를 가진 메타 문자들도 존재합니다.
이것들은 MDN 문서나 아래 링크를 참고하시면 좋을 것 같습니다.
정규표현식에서 자주 사용하는 패턴을 정리하는 위주로 포스팅을 하는 것이라 메타 문자에 대한 자세한 설명을 생략합니다.
정규표현식 패턴 정리
모던 자바스크립트 Deep Dive 책이 정규표현식 패턴을 잘 정리해서, 참고를 많이 했습니다.
사용한 예제는 책과 최대한 다르게 작성하려고 노력했습니다.
1. 문자열 검색
const text = 'Regexp Recording ...';
const regexp = /Regexp/;
// 결과
regexp.test(text); // true
text.match(regexp); // ['Regexp']
2. 임의의 문자열 검색 (메타문자 .을 사용)
const text = 'Regexp Recording ...';
const regexp = /R../g;
// 결과
regexp.test(text); // true
text.match(regexp); // ['Reg', 'Rec']
3. 반복 검색
const text = 'The fear of the LORD is the beginning of knowledge';
// t로 시작하고 뒤에 문자 1개 또는 2개
text.match(/t.{1,2}/gi); // ['The', 'the', 'the]
// t로 시작하고 뒤에 문자 4개
text.match(/t.{4}/gi); // ['The f', 'the L', 'the b']
// o로 시작하고 뒤에 f 1개 이상
text.match(/of{1,}/gi); // ['of', 'of]
// b로 시작하고 뒤에 문자 1개 이상 존재
text.match(/b.+/gi); // ['beginning of knowledge']
// t로 시작하고 뒤에 문자 0개 또는 1개
text.match(/t.?/gi); // ['Th', 'th', 'th']
4. OR 검색
const text = 'The fear of the LORD is the beginning of knowledge';
// 대문자 L '또는' O '또는' R '또는' D
text.match(/L|O|R|D/g); // ['L', 'O', 'R', 'D']
// 대문자 L '또는' O '또는' R '또는' D
text.match(/[LORD]/g); // ['L', 'O', 'R', 'D']
// t로 시작하는 두글자 '또는' o로 시작하는 두글자
text.match(/t.|o./g); // ['of', 'th', 'th', 'of', 'ow']
// 단어 경계에서부터 세글자인 소문자
text.match(/\b[a-z]{3}/g); // ['fea', 'the', 'the', 'beg', 'kno']
// 단어 경계에서부터 시작하는 문자 그리고 단어 경계로 끝나야 함
text.match(/\b[a-z]+\b/g); // ['fear', 'of', 'the', 'is', 'the', 'beginning', 'of', 'knowledge']
5. NOT 검색
const text = 'My name is cheolsker AND age is 999';
// 공백, 알파벳을 제외한 1개 이상의 문자
text.match(/[^A-Za-z\s]+/g); // ['999']
6. 시작 위치로 검색
// 주의 : [] 밖의 ^는 문자열의 시작을 의미, [] 안의 ^은 NOT을 의미합니다.
const text = 'My name is cheolsker AND age is 999';
const regexp = /^My /;
// My로 시작하는 문자열인지 검사
regexp.test(text); // true
7. 마지막 위치로 검색
// 주의 : [] 밖의 ^는 문자열의 시작을 의미, [] 안의 ^은 NOT을 의미합니다.
const text = 'My name is cheolsker AND age is 999';
const regexp = /999$/;
// 999로 끝나는 문자열인지 검사
regexp.test(text); // true
자주 정규표현식 패턴 정리
1. 숫자로만 이루어진 문자열인지 검사
const num = '202310152112'
// case 1
/^\d+$/.test(num); // true
// case 2
/^[0-9]+$/.test(num); // true
// case 3
/^[^\D]+$/.test(num); // true
2. 아이디로 사용 가능한지 검사
const id = 'cheolsker101';
// 8 ~ 12자리인 알파벳 대소문자와 숫자의 조합인지 검사
/^[A-za-z0-9]{8,12}$/.test(id); // true
3. 메일 주소 형식에 맞는지 검사
const email = 'cheolsker101@tistory.com';
/^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/
.test(email) // true;
4. 핸드폰 번호 형식에 맞는지 검사
const phone = '010-0000-0000';
/^\d{3}-\d{3,4}-\d{4}$/.test(phone); // true
5. 특수 문자 포함 여부 검사
const text = '특수 Special !@# 문자 !';
// NOT을 이용한 특수문자 검사
(/[^A-Za-z0-9]/gi).test(text); // true
// OR을 이용해서 특수문자 검사 (특수문자를 직접 타이핑)
(/[\{\}\[\]\/?.,;:|\)*~`!^\-_+<>@\#$%&\\\=\(\'\")]/gi)
.test(text); // true;
참고
모던 자바스크립트 Deep Dive: 자바스크립트의 기본 개념과 동작원리, Ch 31 RegExp
'JavaScript' 카테고리의 다른 글
[Javascript] 이터러블과 이터레이터 개념정리 (2) | 2023.11.14 |
---|---|
[Javascript] 쓰로틀링(throttle), 디바운싱(debounce)을 헷갈리지 말자! (0) | 2023.03.15 |
[Javascript] 2차원 배열 만들기 + 2차원 배열 순회 (0) | 2022.10.15 |
[Javascript] 스코프 체인이란..? (0) | 2022.09.10 |
[Javascript] 함수 선언문과 함수 표현식 (0) | 2022.09.10 |