[10 분 학회] 정규 표현 식 문자 일치 공략

읽 기 제안: 정규 표현 식 의 기 초 를 살 펴 보고 일정한 기본 개념 이 있 으 며 효과 가 가장 좋 습 니 다.
추천 하 는 기본 사이트 주 소 는 정규 표현 식 튜 토리 얼 입 니 다.
정규 표현 식 은 일치 모드 입 니 다. 문자 와 일치 하거나 위치 와 일치 합 니 다.이 말 을 기억 하 세 요.
그러나 문자 와 어떻게 일치 하 는 지 에 대한 학습 은 대부분 복잡 하 다 고 생각한다.
필경 원 문자 가 너무 많아 서 체계 성 이 없어 서 기억 하기 어렵다.본문 은 이 문 제 를 해결한다.
내용 포함:

1.       

2.    

3.   

4.     

5.     

1. 두 가지 모호 일치
만약 정규 가 정확하게 일치 하 는 것 만 으로 는 큰 의미 가 없다. 예 를 들 어 / hello / 는 문자열 의 'hello' 라 는 하위 문자열 만 일치 할 수 있다.

var regex = /hello/;
console.log( regex.test("hello") ); // true

정규 표현 식 이 강 한 이 유 는 모호 한 매 칭 을 실현 할 수 있 기 때문이다.
모호 일치, 두 방향의 '모호': 가로 모호 와 세로 모호.
1.1 가로 모호 일치
가로 모호 란 정규 일치 할 수 있 는 문자열 의 길이 가 고정 되 어 있 지 않 고 여러 가지 상황 을 말 합 니 다.
그 실현 방식 은 양 어 를 사용 하 는 것 이다.예 를 들 어 {m, n} 은 연속 적 으로 최소 m 회, 최대 n 회 가 나타 나 는 것 을 나타 낸다.
예 를 들 어 / ab {2, 5} c / 는 이러한 문자열 과 일치 합 니 다. 첫 번 째 문 자 는 "a" 이 고 그 다음은 2 ~ 5 글자 "b" 이 며 마지막 으로 문자 "c" 입 니 다.테스트 는 다음 과 같 습 니 다:

var regex = /ab{2,5}c/g;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log( string.match(regex) ); // ["abbc", "abbbc", "abbbbc", "abbbbbc"]

주의: 사례 에서 사용 하 는 정규 는 / ab {2, 5} c / g 이 고 뒤에 g 이 많 습 니 다. 이것 은 정규 적 인 수정자 입 니 다.전역 일치, 즉 대상 문자열 에서 일치 하 는 패턴 을 만족 시 키 는 모든 하위 문자열 을 순서대로 찾 습 니 다. '첫 번 째' 가 아니 라 '모든' 을 강조 합 니 다.g 는 단어 global 의 이니셜 입 니 다.
1.2 세로 모호 일치
세로 모호 란 정규 일치 하 는 문자열 을 말 합 니 다. 특정한 문자 에 구체 적 으로 들 어 갈 때 특정한 문자 가 아 닐 수도 있 고 여러 가지 가능성 이 있 습 니 다.
그 실현 방식 은 문자 그룹 을 사용 하 는 것 이다.예 를 들 어 [abc] 는 이 문 자 는 'a', 'b', 'c' 중의 어느 하나 라 도 사용 할 수 있 음 을 나타 낸다.
예 를 들 어 / a [123] b / 는 다음 과 같은 세 가지 문자열 과 일치 할 수 있 습 니 다. "a1b", "a2b", "a3b".테스트 는 다음 과 같 습 니 다:

var regex = /a[123]b/g;
var string = "a0b a1b a2b a3b a4b";
console.log( string.match(regex) ); // ["a1b", "a2b", "a3b"]

이상 은 본 고 에서 말 한 주체 내용 으로 가로 와 세로 의 모호 한 일치 만 파악 하면 대부분의 정규 일치 문 제 를 해결 할 수 있다.
다음 내용 은 이것 에 대해 잘 알 고 있다 면 끝까지 뛰 어 내 려 사례 절 을 직접 볼 수 있다 는 것 이다.
2. 문자 그룹
강조해 야 할 것 은 문자 그룹 (문자 클래스) 이지 만 그 중의 한 글자 일 뿐 입 니 다.예 를 들 어 [abc] 는 'a', 'b', 'c' 중 하나 일 수 있 습 니 다.
2.1 범위 표시 법
문자 그룹 에 문자 가 너무 많 으 면 어떻게 합 니까?범위 표시 법 을 사용 할 수 있다.
예 를 들 어 [123456 abcdefGHIJKLM] 은 [1 - 6a - fg - M] 이 라 고 쓸 수 있다.하이픈 으로 생략 하고 간략하게 쓰 세 요.
연결 문자 가 특수 한 용도 가 있 기 때문에 'a', '-', 'z' 세 글자 중 임의의 문자 와 일치 하려 면 어떻게 해 야 합 니까?
소문 자의 어떤 문자 도 표시 하기 때문에 [a - z] 로 쓸 수 없습니다.
다음 과 같은 방식 으로 쓸 수 있 습 니 다: [- az] 또는 [az -] 또는 [a - z]. 즉, 시작 에 놓 거나 끝 에 놓 거나 의 미 를 바 꿀 수 있 습 니 다. 어쨌든 엔진 이 범위 표시 법 이 라 고 생각 하지 않 으 면 됩 니 다.
2.2 문자 그룹 제외
세로 모호 일치, 또 다른 상황 은 어떤 문자 가 무엇이든 될 수 있 지만 'a', 'b', 'c' 가 될 수 없다 는 것 이다.
이 때 는 문자 그룹 (반 의 문자 그룹) 을 제외 한 개념 이다.예 를 들 어 [^ abc] 는 'a', 'b', 'c' 를 제외 한 임의의 문자 임 을 나타 낸다.문자 그룹의 첫 번 째 방 "^" (탈 문자) 는 반 개념 을 나타 낸다.
물론 그 에 상응하는 범위 표현법 도 있다.
2.3 흔히 볼 수 있 는 약자 형식
문자 그룹의 개념 이 생 긴 후에 흔히 볼 수 있 는 기호 들 도 우 리 는 이해 했다.시스템 자체 의 약자 형식 이기 때문이다.
d 는 [0 - 9] 다.숫자기억 방식: 영 어 는 digit (숫자) 입 니 다.
D 는 [^ 0 - 9] 입 니 다.숫자 를 제외 한 임의의 문 자 를 표시 합 니 다.
바로 [0 - 9a - zA - Z] 입 니 다.숫자, 대소 문자, 밑줄 을 나타 낸다.기억 방식: w 는 워드 의 약자 이 며 단어 문자 라 고도 부른다.
\ W 는 [^ 0 - 9a - zA - Z] 입 니 다.단어 가 아 닌 문자.
예.빈 칸, 수평 탭 문자, 수직 탭 문자, 줄 바 꿈 문자, 리 턴 문자, 페이지 바 꿈 자 를 포함 하여 빈 칸 을 표시 합 니 다.기억 방식: s 는 space character 의 이니셜 입 니 다.
\ S 는 [^ \ t \ v \ r \ f] 입 니 다.공백 문자 가 아 닙 니 다.
바로마스크 는 거의 임의의 문 자 를 나타 낸다.줄 바 꿈, 리 턴, 줄 구분자, 세그먼트 구분자 제외.기억 방식: 생략 번 호 를 생각해 보 세 요...................................................................
임의의 문자 와 일치 하려 면 어떻게 합 니까?[\ d \ D], [\ w \ W], [\ s \ S] 와 [^] 중 하 나 를 사용 할 수 있 습 니 다.
3. 양사
양사 도 중복 이 라 고도 부른다.{m, n} 의 정확 한 의 미 를 파악 한 후 약자 형식 만 기억 해 야 합 니 다.
3.1 약자 형식
{m,} 은 적어도 m 번 은 나타 나 는 것 을 나타 낸다.
{m} 은 {m, m} 과 같 아서 m 회 출현 을 나타 낸다.
? {0, 1} 과 같은 값 으로 나타 나 거나 나타 나 지 않 음 을 나타 낸다.기억 방식: 물음표 의 뜻 은 있 습 니까?
+ 등가 {1,} 은 적어도 한 번 나타 나 는 것 을 나타 낸다.기억 방식: 플러스 는 추가 라 는 뜻 으로 하나 가 있어 야 추 가 를 고려 할 수 있다.
* 등 가 는 {0,} 로 임 의 회 가 나타 나 지 않 을 수 있 음 을 나타 낸다.기억 방식: 하늘의 별 을 보 세 요. 하나 도 없 을 수도 있 고 몇 개가 흩 어 져 있 을 수도 있 고 셀 수도 없 을 수도 있 습 니 다.
3.2 탐욕 매 칭 과 타성 매 칭
다음 과 같은 예 를 보십시오.

var regex = /\d{2,5}/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) ); // ["123", "1234", "12345", "12345"]

그 중에서 정규 / \ d {2, 5} / 는 숫자 가 2 ~ 5 회 연속 나타 나 는 것 을 나타 낸다.2 자리, 3 자리, 4 자리, 5 자리 연속 숫자 가 일치 합 니 다.
하지만 욕심 이 많아 서 가능 한 한 많이 어 울 릴 것 이다.여섯 개 만 주세요. 다섯 개 만 주세요.세 개 만 주세요. 세 개 만 주세요.어차피 능력 범위 내 에 있 으 면 많 을 수록 좋다.
우 리 는 때때로 탐욕 이 좋 은 일이 아니 라 는 것 을 안다.타성 매 칭 은 가능 한 한 적은 매 칭 입 니 다.

var regex = /\d{2,5}?/g;
var string = "123 1234 12345 123456";
console.log( string.match(regex) ); // ["12", "12", "34", "12", "34", "12", "34", "56"]

그 중 / \ d {2, 5}? /2 번 에서 5 번 다 괜 찮 지만 2 개 면 충분 할 때 는 더 이상 시도 하지 않 는 다 는 뜻 이다.
양사 뒤에 물음 표를 붙 이면 타성 매 칭 을 실현 할 수 있 기 때문에 모든 타성 매 칭 상황 은 다음 과 같다.
{m,n}? {m,}? ?? +? *? 타성 에 맞 는 기억 방식 은 양사 뒤에 물음 표를 붙 이 고 물 어 보 는 것 입 니 다. 만족 하 십 니까? 욕심 이 많 습 니까?
4. 가 지 를 많이 선택한다
하나의 패턴 은 가로 와 세로 가 모호 하 게 일치 할 수 있다.여러 개의 가 지 를 선택 하면 여러 개의 키 모드 중 하 나 를 선택 할 수 있 습 니 다.
구체 적 인 형식 은 다음 과 같다. (p1 | p2 | p3) 그 중에서 p1, p2 와 p3 는 하위 모드 이 고 '|' (파이프라인 문자) 로 구분 하여 그 중 하 나 를 나타 낸다.
예 를 들 어 'good' 과 'nice' 를 일치 시 키 려 면 / good | nice / 를 사용 할 수 있 습 니 다.테스트 는 다음 과 같 습 니 다:

var regex = /good|nice/g;
var string = "good idea, nice try.";
console.log( string.match(regex) ); // ["good", "nice"]

그러나 내 가 / good | goodbye / 를 사용 하여 "goodbye" 문자열 과 일치 할 때 결 과 는 "good" 입 니 다.

var regex = /good|goodbye/g;
var string = "goodbye";
console.log( string.match(regex) ); // ["good"]

정규 를 / goodbye | good / 로 바 꾼 결과 는

var regex = /goodbye|good/g;
var string = "goodbye";
console.log( string.match(regex) ); // ["goodbye"]

즉, 분기 구조 도 타성 이다. 즉, 앞의 일치 가 되면 뒤의 것 은 더 이상 시도 하지 않 는 다 는 것 이다.
5. 사례 분석
일치 하 는 문 자 는 문자 그룹, 양사, 분기 구조의 조합 에서 만 사용 할 수 있 습 니 다.
다음은 몇 가지 예 를 찾 아 연습 해 보 겠 습 니 다.
5.1 16 진수 색상 값 일치
요구 일치:
#ffbbad
#Fc01DF
#FFF
#ffE
분석:
16 진수 문 자 를 표시 합 니 다. 문자 그룹 [0 - 9a - fA - F] 을 사용 할 수 있 습 니 다.
그 중에서 문 자 는 3 번 이나 6 번 나 올 수 있 고 양사 와 분기 구 조 를 사용 해 야 한다.
분기 구 조 를 사용 할 때 는 순서 에 주의해 야 한다.
정 칙 은 다음 과 같다.

var regex = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})/g;
var string = "#ffbbad #Fc01DF #FFF #ffE";
console.log( string.match(regex) ); // ["#ffbbad", "#Fc01DF", "#FFF", "#ffE"]

5.2 일치 시간
24 시간 제 를 예 로 들 면.
요구 일치:
23:59
02:07
분석:
총 4 자리 숫자 로 첫 번 째 숫자 는 [0 - 2] 일 수 있다.
1 위 가 2 일 때 2 위 는 [0 - 3], 그 밖의 경우 2 위 는 [0 - 9] 가 될 수 있다.
3 위 는 [0 - 5], 4 위 는 [0 - 9] 였 다.
정 칙 은 다음 과 같다.

var regex = /^([01][0-9]|[2][0-3]):[0-5][0-9]$/;
console.log( regex.test("23:59") ); // true
console.log( regex.test("02:07") ); // true

7 대 9 와 일치 하 라 고 요구 하면 시간 앞 에 있 는 0 은 생략 할 수 있다 는 것 이다.
이 때 는 바로:

var regex = /^(0?[0-9]|1[0-9]|[2][0-3]):(0?[0-9]|[1-5][0-9])$/;
console.log( regex.test("23:59") ); // true
console.log( regex.test("02:07") ); // true
console.log( regex.test("7:9") ); // true

5.3 일치 날짜
예 를 들 어 yyy - mm - dd 형식 을 예 로 들 면.
요구 일치:
2017-06-10
분석:
년, 네 자리 숫자 면 됩 니 다. [0 - 9] {4} 을 사용 할 수 있 습 니 다.
월, 총 12 개 월, 두 가지 상황 으로 나 뉘 어 01, 02,..., 09 와 10, 11, 12, 사용 가능 (0 [1 - 9] | 1 [0 - 2]).
일, 최대 31 일, 사용 가능 (0 [1 - 9] | [12] [0 - 9] | 3 [01]).
정 칙 은 다음 과 같다.

var regex = /^[0-9]{4}-(0[1-9]|1[0-2])-(0[1-9]|[12][0-9]|3[01])$/;
console.log( regex.test("2017-06-10") ); // true

5.4 window 운영 체제 파일 경로
요구 일치:

F:\study\javascript\regex\regular expression.pdf

F:\study\javascript\regex\

F:\study\javascript

F:\

분석:
전체 모드: 디스크: \ 폴 더 \ 폴 더 \ 폴 더 \ 폴 더 \ \
그 중 일치 하 는 F: \, 사용 해 야 합 니 다 [a - zA - Z]: \, 그 중 디스크 부 호 는 대소 문 자 를 구분 하지 않 습 니 다. 주의 \ 문 자 는 전의 가 필요 합 니 다.
파일 이름 이나 폴 더 이름 은 특수 문 자 를 포함 할 수 없습니다. 이 때 는 문자 그룹 [^ \: < > |? \ r /] 을 제외 하고 합 법 적 인 문 자 를 표시 해 야 합 니 다.또한 빈 이름 이 될 수 없습니다. 적어도 한 글자, 즉 양사 + 를 사용 해 야 합 니 다.따라서 "폴 더 \" 와 일치 하여 [^ \: < > | "? \ r /] + \ 를 사용 할 수 있 습 니 다.
또한 "폴 더 \" 는 임의로 나타 날 수 있 습 니 다.바로 (^ \: < > |? \ r /] + \) 입 니 다.괄호 는 하위 표현 식 을 제공 합 니 다.
경로 의 마지막 부분 은 '폴 더' 일 수 있 습 니 다. \ 가 없 기 때문에 추가 해 야 합 니 다 ([^ \: * > |? \ r /] +).
마지막 으로 비교적 복잡 해 보 이 는 정규 로 연결 되 었 다.

var regex = /^[a-zA-Z]:\\([^\\:*<>|"?\r
/]+\\)*([^\\:*<>|"?\r
/]+)?$/;
console.log( regex.test("F:\\study\\javascript\\regex\\regular expression.pdf") ); // true
console.log( regex.test("F:\\study\\javascript\\regex\\") ); // true
console.log( regex.test("F:\\study\\javascript") ); // true
console.log( regex.test("F:\\") ); // true

그 중에서 도 JS 에서 문자열 이 '\' 를 표시 할 때 도 의 미 를 바 꿔 야 한다.
5.5 일치 id
요구 하 다

<div id="container" class="main">div>

id = "container" 를 추출 합 니 다.
아마도 가장 먼저 생각 나 는 정규 는:

var regex = /id=".*"/
var string = '
';
console.log(string.match(regex)[0]); // id="container" class="main"

因为.是通配符，本身就匹配双引号的，而量词*又是贪婪的，当遇到container后面双引号时，不会停下来，会继续匹配，直到遇到最后一个双引号为止。

解决之道，可以使用惰性匹配：

var regex = /id=".*?"/
var string = '
';
console.log(string.match(regex)[0]); // id="container"

当然，这样也会有个问题。效率比较低，因为其匹配原理会涉及到“回溯”这个概念（这里也只是顺便提一下，后续文章会说明）。可以优化如下：

var regex = /id="[^"]*"/
var string = '
r" class="main">
';
console.log(string.match(regex)[0]); // id="container"

【 끝 】