정규 표현식 (REGEX: Regular Expression)

1. 정규 표현식의 문법

• 텍스트에서 우리가 원하는 특정한 패턴을 찾을 때, 찾아서 처리할 때, 혹은 입력된 데이터의 유효성을 검사할 때 정규 표현식을 사용하면 유용하다!

• 정규표현식 = 패턴 구분자 시작(/) + 작성할 패턴 + 패턴 구분자 끝(/) + 패턴 변경자(g 또는 gm)

• 패턴 변경자(flag) : 1.3.7. 예시 참고!!

  • g(global): 매칭되는 다수의 결괏값을 기억함
  • m(multiline): 한 줄을 한 문장으로 인식함

• 정규 표현식 테스트 사이트 : regexr.com/

1.1. 그룹, 레인지 (Groupes and Ranges)

Character	Description
|	또는
()	그룹
[]	문자세트, 괄호 안의 어떤 문자든
[^]	부정 문자세트, 괄호 안의 어떤 문자가 아닐 때
(?:)	찾지만 기억하지는 않음

예시 )

1.1.1. < 일반적인 텍스트 검사하기 1 >

1.1.2. < 일반적인 텍스트 검사하기 2 >

1.1.3. < 버티컬바(|)를 이용하여 하나라도 매칭되는 텍스트 찾기 >

1.1.4. < 소괄호를 이용하여 그룹 지정하기 >

1.1.5. < 여러 개의 소괄호를 이용하여 여러 그룹 지정하기 > → 마우스를 올리면 어느 그룹에 매칭되는 지 표시됨

1.1.6. < 소괄호와 버티컬바를 이용하여 grey 또는 gray 찾기 >

1.1.7. < 물음표와 콜론을 이용하여, 찾지만 기억하지 않기 > → 위(?:를 쓰지 않고 소괄호만 사용했을 때)에서는 그룹이 지정되지만, 아래에서는 그룹이 지정되지 않음. 소괄호를 텍스트를 찾는 도구로써만 사용하는 것.

1.1.8. < 소괄호와 버티컬바를 이용하여 grey 또는 gray 또는 grdy 찾기 >

1.1.9. < 대괄호를 이용하여 grey 또는 gray 또는 grdy 찾기 1 > → 대괄호 안의 어떤 문자든 들어 있기만 하면 찾음

1.1.10. < 대괄호를 이용하여 grey 또는 gray 또는 grdy 찾기 2 > → 대괄호 안에 범위를 지정하여 찾는 방법 (gray, grby, grcy, grdy, grey가 모두 가능)

1.1.11. < 대괄호를 이용하여 다양한 집합체 만들어 보기 > → ‘소문자 a부터 z까지, 대문자 A부터 Z까지, 숫자 0부터 9까지’라고 지정하여 찾음

1.1.12. < 꺽쇠(눈웃음)를 이용하여 ‘지정한 내용을 제외한 모든 것’을 찾아 보기 > → ‘소문자 a부터 z까지, 대문자 A부터 Z까지, 숫자 0부터 9까지’에 해당하지 않는 내용만 찾음

1.2. 수량 (Quantifiers)

Character	Description
?	없거나 하나 있거나 (zero or one)
/*	없거나 하나 있거나 많거나 (zero or more)
+	하나 또는 많이 (one or more)
{n}	n번 반복
{min,}	최소
{min,max}	최소, 최대

예시 )

1.2.1. < 물음표를 이용하여 앞의 문자가 없거나 하나 있는 경우 찾기 > → a가 하나 있거나(gray) 없는 경우(gry)를 찾음

1.2.2. < 별표를 이용하여 앞의 문자가 없거나 하나 있거나 많은 경우 찾기 > → a가 하나 있거나(gray) 없거나(gry) 많은 경우(graay, graaay)를 찾음

1.2.3. < 더하기를 이용하여 앞의 문자가 하나 있거나 많은 경우 찾기 > → a가 하나 있거나(gray) 많은 경우(graay, graaay)를 찾음

1.2.4. < 중괄호를 이용하여 앞의 문자의 개수를 지정하여 찾기 > → a가 2개인 경우를 찾음

1.2.5. < 중괄호를 이용하여 앞의 문자의 최소 개수를 지정하여 찾기 > → a가 2개 이상인 경우를 찾음

1.2.6. < 중괄호를 이용하여 앞의 문자의 최소, 최대 개수를 지정하여 찾기 > → a가 최소 1개 최대 3개인 경우를 찾음

1.3. 단어 경계 (Boundary-type)

Character	Description
/b	단어 경계 (boundary)
/B	단어 경계가 아님
^	문장의 시작
$	문장의 끝

예시 )

1.3.1. < /b를 이용하여 단어 앞부분에서 쓰인 특정 문자열 찾기 > → /b를 Ya 앞에 붙이면 단어의 앞부분에 쓰인 Ya만 찾음

1.3.2. < /B를 이용하여 단어 앞부분에서 쓰이지 않은 특정 문자열 찾기 > → /B를 Ya 앞에 붙이면 단어의 앞부분에 쓰이지 않은 Ya만 찾음

1.3.3. < /b를 이용하여 단어 뒷부분에서 쓰인 특정 문자열 찾기 > → /b를 Ya 뒤에 붙이면 단어의 뒷부분에 쓰인 Ya만 찾음

1.3.4. < /B를 이용하여 단어 뒷부분에서 쓰이지 않은 특정 문자열 찾기 > → /B를 Ya 뒤에 붙이면 단어의 뒷부분에 쓰이지 않은 Ya만 찾음

1.3.5. < 꺽쇠(눈웃음)를 사용하여 문장의 시작 부분에서 쓰인 특정 문자열 찾기 > → ^를 Ya 앞에 붙이면 문장의 시작 부분에 쓰인 Ya만 찾음

1.3.6. < 달러를 사용하여 문장의 끝 부분에서 쓰인 특정 문자열 찾기 > → $를 Ya 뒤에 붙이면 문장의 끝 부분에 쓰인 Ya만 찾음

1.3.7. < flag g(global)과 gm(global & multiline)의 차이점 > → multiline flag를 선택하지 않았을 경우(/Ya$/g), 글 전체를 한 문장으로 보기 때문에 Ya를 찾지 못함 → 따라서, 글의 마지막에 Ya를 추가하면 찾는 것을 볼 수 있음 → multiline flag를 선택했을 경우(/Ya$/gm), 각 줄을 문장으로 인식하기 때문에 세 번째 줄의 Ya와 마지막 줄의 Ya를 모두 찾음

1.4. 문자 (Character Classes)

Character	Description
\	특수문자가 아닌 문자
.	모든 글자 (줄바꿈 문자 제외)
/d	숫자 (digit)
/D	숫자 아님
/w	문자 (word)
/W	문자 아님
/s	공백 (space)
/S	공백 아님

예시 )

1.4.1. < 마침표를 사용하여 줄바꿈 문자를 제외한 모든 문자를 선택하기 >

1.4.2. < 역슬래시(\)를 사용하여 특수문자열 찾기 > → 정규 표현식에서 기능하는 특수문자가 아닌, 텍스트로 사용된 특수문자를 찾고 싶을 때 \를 사용. (모든 문자를 선택하는 특수문자 마침표가 아니라, 텍스트에서 실제로 마침표로 사용된 것을 찾는 것) → 특수문자 하나 당 \ 하나씩 사용해야 함

1.4.3. < /d를 이용하여 숫자 찾기 > → 특수문자와 공백도 찾음

1.4.4. < /D를 이용하여 숫자가 아닌 모든 문자 찾기 >

1.4.5. < /w를 이용하여 모든 문자열 찾기 > → 특수문자와 공백 제외

1.4.6. < /W를 이용하여 문자열을 제외한 모든 것 찾기 > → 특수문자와 공백도 찾음

1.4.7. < /s를 이용하여 공백 찾기 >

1.4.8. < /S를 이용하여 공백을 제외한 모든 것 찾기>

2. 정규 표현식 연습

2.1. 전화번호 찾기

2.2. 이메일 찾기

→ 최소 하나가 있으면서 많은 경우를 포함하기 위해 +를 사용

2.3. 유튜브 비디오 id 가져오기

→ 원하는 것은 세 번째 그룹인 비디오 아이디 부분이기 때문에 앞의 두 그룹은 ?:을 사용하여 ‘찾지만 기억하지 않음’

3. 자바스크립트에서의 활용 예시 (2.3. 심화)

1. 콘솔 창에서 슬래시를 이용해 regex 변수에 정규 표현식을 할당함

2. url 변수에 유튜브 주소를 할당함

3. 해당 url에 원하는 정규표현식을 매칭하는 함수를 호출하면, 결괏값이 배열로 리턴됨. (비디오 id는 index 1에 해당하는 것을 볼 수 있음)

4. result 변수에 매칭되는 결과를 할당함

5. result라는 배열의 index 1 데이터를 가져오면 비디오 id를 볼 수 있음

---

콘솔 테스트 예시

// /apple/.test("apple")
// true

// /apple/.test("applq")
// false

// /a@a.com/.test("a@a.com")
// true

// /a@a.com/.test("b@a.com")
// false

// /\w@a.com/.test("sdfafdsfadfdsb@a.com")
// true

// /^\w@a.com$/.test("sdfafdsfadfdsb@a.com")
// false

// /^\w@a.com$/.test("w@a.com")
// true

// /^\w+@a.com$/.test("sdfsdfsdfsfsdfsdf@a.com")
// true

// /^\w?@a.com$/.test("@a.com")
// true

// /^\w?@a.com$/.test("d@a.com")
// true

// /^\w?@a.com$/.test("drrr@a.com")
// false

// /^\w*@a.com$/.test("@a.com")
// true

// /^\w*@a.com$/.test("e@a.com")
// true

// /^\w*@a.com$/.test("eeeeeee@a.com")
// true

// /^\w+@a.com$/.test("eeeeeee$a.com")
// false

// /^\w+@\w+.com$/.test("sdfs@dfd.com")
// true

// /^\w+@\w+.\w+$/.test("sdfs@dfd.net")
// true

// /^\w+@\w+.\w+$/.test("sdfs@dfd;.net")
// false

// /^\w+@\w+\.\w+$/.test("sdfs@dfd.net")
// true

// /^\w+@\w+.\w+$/.test("sdfs@dfd;.net")
// false

// /010-1234-5678/.test("010-1234-5678")
// true

// /^\d+-1234+-5678$/.test("01dfsf0-1234-5678")
// false

// /^\d+-1234+-5678$/.test("88787-1234-5678")
// true

// /^\d{3}-1234+-5678$/.test("88787-1234-5678")
// false

// /^\d{3}-1234+-5678$/.test("887-1234-5678")
// true

// /^\d{3}-\{3,4}-\d{4}$/.test("887-444-5678")
// false

// /^\d{3}-\d{3,4}-\d{4}$/.test("887-444-5678")
// true

📌 참고: 정규표현식 , 더이상 미루지 말자 🤩