JavaScript 정규식에 대한 빠르고 간단한 안내서

JavaScript 학습에 관심이 있으십니까? jshandbook.com에서 무료 전자 책 받기

정규식 소개

정규식 (줄여서 정규식이라고도 함)은 텍스트 문자열을 처리하는 빠른 방법입니다.

특수한 구문으로 정규식을 공식화하면 다음을 수행 할 수 있습니다.

  • 문자열에서 텍스트를 검색
  • 문자열에서 부분 문자열 교체
  • 문자열에서 정보를 추출

거의 모든 프로그래밍 언어에는 정규식 구현이 있습니다. 각 구현마다 약간의 차이가 있지만 일반적인 개념은 거의 모든 곳에 적용됩니다.

정규식은 문자열 처리 알고리즘에 대한 개념적 검색 패턴으로 공식화 된 1950 년대로 거슬러 올라갑니다.

grep, sed와 같은 UNIX 도구와 널리 사용되는 텍스트 편집기에서 구현 된 regexe는 인기를 얻었습니다. 그것들은 Perl 프로그래밍 언어에 소개되었고 나중에 다른 많은 언어에도 도입되었습니다.

Perl과 함께 JavaScript는 언어에 직접 내장 된 정규식을 지원하는 프로그래밍 언어 중 하나입니다.

단단하지만 유용한

정규 표현식은 초보자에게도 말도 안되는 것처럼 보일 수 있으며, 이해하는 데 필요한 시간을 투자하지 않으면 전문 개발자에게도 여러 번 표현 될 수 있습니다.

암호화 정규 표현식은 쓰기 어렵고 읽기 어렵고 유지 / 수정하기가 어렵습니다.

그러나 때로는 정규식이 문자열 조작을 수행하는 유일한 방법이므로 주머니에 매우 유용한 도구입니다.

이 학습서에서는 간단한 방법으로 JavaScript 정규식을 소개하고 정규식을 읽고 작성하는 데 필요한 모든 정보를 제공합니다.

일반적으로 간단한 정규식은 읽고 쓰기가 간단하지만 기본을 깊이 이해하지 않으면 복잡한 정규식이 엉망이 될 수 있습니다.

정규식은 어떻게 생겼습니까?

JavaScript에서 정규식은 객체이며 두 가지 방법으로 정의 할 수 있습니다.

첫 번째는 생성자를 사용하여 새 RegExp 객체를 인스턴스화하는 것입니다.

const re1 = 새로운 RegExp ( 'hey')

두 번째는 정규 표현식 리터럴 양식을 사용하는 것입니다.

const re1 = / hey /

JavaScript에는 객체 리터럴과 배열 리터럴이 있다는 것을 알고 있습니까? 정규식 리터럴도 있습니다.

위의 예에서는 패턴이라고합니다. 리터럴 형식에서는 슬래시로 구분되지만 개체 생성자는 그렇지 않습니다.

이것이 두 양식의 첫 번째 중요한 차이점이지만 나중에 다른 유형을 보게됩니다.

어떻게 작동합니까?

위에서 re1으로 정의한 정규식은 매우 간단합니다. 문자열 hey를 제한없이 검색합니다. 문자열은 많은 텍스트를 포함 할 수 있으며 중간에이 정규식이 만족됩니다. 그것은 단지 이봐도 포함 할 수 있으며 정규 표현식도 만족할 것입니다.

아주 간단합니다.

부울을 반환하는 RegExp.test (String)을 사용하여 정규식을 테스트 할 수 있습니다.

re1.test ( 'hey') // 
re1.test ( 'blablabla hey blablabla') // 
re1.test ( 'he') // 
re1.test ( 'blablabla') // 

위의 예에서 "hey"가 re1에 저장된 정규식 패턴을 만족하는지 확인했습니다.

이것이 가장 간단하지만 이제는 이미 정규 표현식에 대한 많은 개념을 알고 있습니다.

정박

/야/

문자열 안에 넣은 곳마다 이봐

hey로 시작하는 문자열을 일치 시키려면 ^ 연산자를 사용하십시오.

/^hey/.test('hey ') // 
/^hey/.test('bla hey ') // 

hey로 끝나는 문자열을 일치 시키려면 $ 연산자를 사용하십시오.

/hey$/.test('hey ') // 
/hey$/.test('bla hey ') // 
/hey$/.test('hey you ') // 

그것들을 결합하고 정확하게 일치하는 문자열과 해당 문자열을 일치시킵니다.

/^hey$/.test('hey ') // 

하위 문자열로 시작하고 다른 문자열로 끝나는 문자열을 일치 시키려면. *를 사용하면 0 번 이상 반복되는 모든 문자와 일치합니다.

/^hey.*joe$/.test('hey joe ') // 
/^hey.*joe$/.test('heyjoe ') // 
/^hey.*joe$/.test('hey 어떻게 지내세요 ') // 
/^hey.*joe$/.test('hey joe! ') // 

범위의 항목 일치

특정 문자열을 일치시키는 대신 다음과 같은 범위의 모든 문자와 일치하도록 선택할 수 있습니다.

/ [a-z] / // a, b, c, ..., x, y, z
/ [A-Z] / // A, B, C, ..., X, Y, Z
/ [a-c] / // a, b, c
/ [0-9] / // 0, 1, 2, 3, ..., 8, 9

이 정규식은 해당 범위의 문자 중 하나 이상을 포함하는 문자열과 일치합니다.

/[a-z]/.test('a ') // 
/[a-z]/.test('1 ') // 
/[a-z]/.test('A ') // 
/[a-c]/.test('d ') // 
/[a-c]/.test('dc ') // 

범위를 결합 할 수 있습니다 :

/ [A-Za-z0-9] /
/[A-Za-z0-9]/.test('a ') // 
/[A-Za-z0-9]/.test('1 ') // 
/[A-Za-z0-9]/.test('A ') // 

범위 항목을 여러 번 일치

-char을 사용하여 문자열 범위 내에 한 문자 만 포함되어 있는지 확인할 수 있습니다.

/ ^ [A-Za-z0-9] $ /
/^[A-Za-z0-9]$/.test('A ') // 
/^[A-Za-z0-9]$/.test('Ab ') // 

패턴 부정

패턴의 시작 부분에있는 ^ 문자는 문자열의 시작 부분에 고정합니다.

범위 내에서 사용하면 범위를 무효화하므로 다음을 수행하십시오.

/[^A-Za-z0-9]/.test('a ') // 
/[^A-Za-z0-9]/.test('1 ') // 
/[^A-Za-z0-9]/.test('A ') // 
/[^A-Za-z0-9]/.test('@ ') // 
  • \ d는 [0-9]에 해당하는 모든 숫자와 일치합니다.
  • \ D는 [^ 0-9]에 해당하는 숫자가 아닌 문자와 일치합니다
  • \ w는 [A-Za-z0-9]에 해당하는 모든 영숫자 문자와 일치합니다
  • \ W는 [^ A-Za-z0-9]와 같은 영숫자가 아닌 문자와 일치합니다.
  • \ s는 공백, 탭, 줄 바꿈 및 유니 코드 공백과 같은 공백 문자와 일치합니다.
  • \ S는 공백이 아닌 모든 문자와 일치합니다
  • \ 0은 null과 일치
  • \ n 개행 문자와 일치
  • \ t는 탭 문자와 일치
  • \ uXXXX는 코드 XXXX의 유니 코드 문자와 일치합니다 (u 플래그 필요).
  • . 개행 문자가 아닌 모든 문자와 일치합니다 (예 : \ n) (s 플래그를 사용하지 않는 한 나중에 설명)
  • [^]는 개행 문자를 포함하여 모든 문자와 일치합니다. 여러 줄 문자열에 유용합니다.

정규식 선택

한 문자열 또는 다른 문자열을 검색하려면 | 운영자.

/hey|ho/.test('hey ') // 
/hey|ho/.test('ho ') // 

수량 자

문자열에 한 자리 숫자가 있는지 확인하는 다른 정규 표현식이 있다고 가정 해보십시오.

/ ^ \ d $ /

사용할 수 있습니까? 선택적으로 만들기 위해 수량화하여 0 또는 1이 필요합니다.

/ ^ \ d? $ /

그러나 여러 자릿수를 일치 시키려면 어떻게해야합니까?

+, *, {n} 및 {n, m}을 사용하여 4 가지 방법으로 수행 할 수 있습니다. 이것들을 하나씩 봅시다.

+

하나 이상의 (> = 1) 항목과 일치

/ ^ \ d + $ /
/^\d+$/.test('12 ') // 
/^\d+$/.test('14 ') // 
/^\d+$/.test('144343 ') // 
/ ^ \ d + $ /. test ( '') // 
/^\d+$/.test('1a ') // 

*

0 개 이상의 항목 일치 (> = 0)

/ ^ \ d + $ /
/^\d*$/.test('12 ') // 
/^\d*$/.test('14 ') // 
/^\d*$/.test('144343 ') // 
/ ^ \ d * $ /. test ( '') // 
/^\d*$/.test('1a ') // 

{엔}

정확히 n 개의 항목과 일치

/ ^ \ d {3} $ /
/^\d{3}$/.test('123 ') // 
/^\d{3}$/.test('12 ') // 
/^\d{3}$/.test('1234 ') // 
/^[A-Za-z0-9]{3}$/.test('Abc ') // 

{n, m}

n과 m 사이의 일치 :

/ ^ \ d {3,5} $ /
/^\d{3,5}$/.test('123 ') // 
/^\d{3,5}$/.test('1234 ') // 
/^\d{3,5}$/.test('12345 ') // 
/^\d{3,5}$/.test('123456 ') // 

열린 결말을 갖기 위해 m을 생략 할 수 있으므로 n 개 이상의 항목이 있습니다.

/ ^ \ d {3,} $ /
/^\d{3,}$/.test('12 ') // 
/^\d{3,}$/.test('123 ') // 
/^\d{3,}$/.test('12345 ') // 
/^\d{3,}$/.test('123456789 ') // 

옵션 품목

?로 상품을 팔로 잉 선택 사항으로 만듭니다.

/ ^ \ d {3} \ w? $ /
/^\d{3}\w?$/.test('123 ') // 
/^\d{3}\w?$/.test('123a ') // 
/^\d{3}\w?$/.test('123ab ') // 

여러 떼

괄호를 사용하여 문자 그룹을 만들 수 있습니다 : (...)

이 예는 정확히 3 자리 숫자 다음에 하나 이상의 영숫자 문자를 찾습니다.

/ ^ (\ d {3}) (\ w +) $ /
/^(\d{3})(\w+)$/.test('123 ') // 
/^(\d{3})(\w+)$/.test('123s ') // 
/^(\d{3})(\w+)$/.test('123something ') // 
/^(\d{3})(\w+)$/.test('1234 ') // 

그룹 닫는 괄호 뒤에있는 반복 문자는 전체 그룹을 나타냅니다.

/ ^ (\ d {2}) + $ /
/^(\d{2})+$/.test('12 ') // 
/^(\d{2})+$/.test('123 ') // 
/^(\d{2})+$/.test('1234 ') // 

캡처 그룹

지금까지 문자열을 테스트하고 특정 패턴이 포함되어 있는지 확인하는 방법을 살펴 보았습니다.

정규 표현식의 매우 멋진 기능은 문자열의 일부를 캡처하여 배열에 넣는 기능입니다.

그룹, 특히 캡처 그룹을 사용하여이를 수행 할 수 있습니다.

기본적으로 그룹은 캡처 그룹입니다. 이제 패턴이 충족되면 부울을 반환하는 RegExp.test (String) 대신 String.match (RegExp) 또는 RegExp.exec (String)를 사용합니다.

그것들은 정확히 동일하며, 첫 번째 항목에서 일치하는 전체 문자열을 가진 배열을 반환 한 다음 일치하는 각 그룹 내용을 반환합니다.

일치하는 것이 없으면 null을 반환합니다.

'123s'.match (/ ^ (\ d {3}) (\ w +) $ /)
// 배열 [ "123s", "123", "s"]
/^(\d{3})(\w+)$/.exec('123s ')
// 배열 [ "123s", "123", "s"]
'hey'.match (/ (hey | ho) /)
// 배열 [ "hey", "hey"]
/(hey|ho)/.exec('hey ')
// 배열 [ "hey", "hey"]
/(hey|ho)/.exec('ha! ')
//없는

그룹이 여러 번 일치하면 마지막 일치 만 결과 배열에 배치됩니다.

'123456789'.match (/ (\ d) + /)
// 배열 [ "123456789", "9"]

선택적 그룹

(...)?를 사용하여 캡처 그룹을 선택적으로 만들 수 있습니다. 찾지 못한 경우 결과 배열 슬롯에는 정의되지 않은 내용이 포함됩니다.

/^(\d{3})(\s)?(\w+)$/.exec('123 s ')
// 배열 [ "123 s", "123", "", "s"]
/^(\d{3})(\s)?(\w+)$/.exec('123s ')
// 배열 [ "123s", "123", 정의되지 않음, "s"]

일치하는 그룹

일치하는 모든 그룹에 번호가 할당됩니다. $ 1은 첫 번째, $ 2는 두 번째 등을 나타냅니다. 나중에 문자열 부분 교체에 관해 이야기 할 때 유용합니다.

명명 된 캡처 그룹

이것은 새로운 ES2018 기능입니다.

결과 배열에 슬롯을 할당하는 대신 그룹을 이름에 할당 할 수 있습니다.

const re = / (? <년> \ d {4})-(?  \ d {2})-(? <일> \ d {2}) /
const 결과 = re.exec ( '2015-01-02')
// result.groups.year === '2015';
// result.groups.month === '01';
// result.groups.day === '02';

그룹없이 일치 및 실행 사용

그룹없이 match와 exec를 사용하는 것에는 차이가 있습니다. 배열의 첫 번째 항목은 전체 일치 문자열이 아니라 직접 일치합니다.

/hey|ho/.exec('hey ')
// [ "야" ]
/(hey).(ho)/.exec('hey ho ')
// [ "hey ho", "hey", "ho"]

비 캡처 그룹

기본적으로 그룹은 캡처 그룹이므로 결과 배열에서 일부 그룹을 무시하는 방법이 필요합니다. 이것은 (? : ...)로 시작하는 비 캡처 그룹을 사용하여 가능합니다.

'123s'.match (/ ^ (\ d {3}) (? : \ s) (\ w +) $ /)
//없는
'123 s'.match (/ ^ (\ d {3}) (? : \ s) (\ w +) $ /)
// 배열 [ "123 s", "123", "s"]

플래그

정규식에 다음 플래그를 사용할 수 있습니다.

  • g : 패턴을 여러 번 일치시킵니다
  • i : 정규식 대소 문자를 구분하지 않습니다.
  • m : 멀티 라인 모드를 활성화합니다. 이 모드에서 ^와 $는 전체 문자열의 시작과 끝과 일치합니다. 이것이 없으면 여러 줄 문자열로 각 줄의 시작과 끝과 일치합니다.
  • u : 유니 코드 지원 가능 (ES6 / ES2015에서 도입)
  • s : (ES2018의 새로운 기능) 한 줄로 짧아서. 줄 바꿈 문자도 일치시킵니다.

플래그를 결합 할 수 있으며 정규식 리터럴에서 문자열 끝에 추가됩니다.

/hey/ig.test('HEy ') // 

또는 RegExp 객체 생성자를 사용하여 두 번째 매개 변수로 사용하십시오.

새로운 RegExp ( 'hey', 'ig'). test ( 'HEy') // 

정규식 검사

정규식이 주어지면 속성을 검사 할 수 있습니다.

  • 패턴 문자열을 소싱
  • m 플래그를 사용하여 여러 줄 true
  • g 플래그로 전역 참
  • i 플래그를 사용하여 ignoreCase true
  • lastIndex
/^(\w{3})$/i.source // "^ (\\ d {3}) (\\ w +) $"
/^(\w{3})$/i.multiline // false
/^(\w{3})$/i.lastIndex // 0
/^(\w{3})$/i.ignoreCase // true
/^(\w{3})$/i.global // false

탈출

이 문자들은 특별하다 :

  • \
  • /
  • []
  • ()
  • {}
  • ?
  • +
  • *
  • |
  • .
  • ^
  • $

정규 표현식 패턴에서 의미가있는 제어 문자이므로 특수합니다. 패턴 내에서 일치하는 문자로 사용하려면 백 슬래시를 추가하여 이스케이프해야합니다.

/ ^ \\ $ /
/ ^ \ ^ $ / // /^\^$/.test('^ ') 
/ ^ \ $$ / // /^\$$/.test('$ ') 

문자열 경계

\ b 및 \ B를 사용하면 문자열이 단어의 시작 또는 끝에 있는지 여부를 검사 할 수 있습니다.

  • \ b는 단어의 시작 또는 끝에있는 문자 세트와 일치합니다.
  • \ B는 단어의 시작 또는 끝에없는 문자 세트와 일치합니다.

예:

'곰을 보았다'.match (/ \ bbear /) // Array [ "bear"]
'나는 수염을 보았다'.match (/ \ bbear /) // 배열 [ "곰"]
'나는 수염을 보았다'.match (/ \ bbear \ b /) // null
'cool_bear'.match (/ \ bbear \ b /) // 널

정규식을 사용하여 바꾸기

문자열에 패턴이 있는지 확인하는 방법을 이미 보았습니다.

또한 문자열의 일부를 배열로 추출하여 패턴과 일치시키는 방법을 보았습니다.

패턴을 기반으로 문자열의 일부를 바꾸는 방법을 살펴 보겠습니다.

JavaScript의 String 객체에는 replace () 메서드가 있으며 정규 표현식없이 문자열에서 단일 교체를 수행하는 데 사용할 수 있습니다.

"Hello world!". replace ( 'world', 'dog')
// 안녕하세요!
"내 개는 좋은 개입니다!". replace ( 'dog', 'cat')
// 고양이는 좋은 개입니다!

이 메소드는 또한 정규식을 인수로 허용합니다.

"Hello world!". replace (/ world /, 'dog') // 안녕하세요!

g 플래그를 사용하는 것은 바닐라 JavaScript에서 문자열에서 여러 항목을 바꾸는 유일한 방법입니다.

"내 개는 좋은 개입니다!". replace (/ dog / g, 'cat')
// 내 고양이는 좋은 고양이입니다!

그룹을 사용하면 줄의 일부를 움직이는 것처럼 더 멋진 일을 할 수 있습니다.

"Hello, world!". replace (/ (\ w +), (\ w +)! /, '$ 2 : $ 1 !!!')
// "세계 : 안녕하세요 !!!"

문자열을 사용하는 대신 함수를 사용하여 더 멋진 작업을 수행 할 수 있습니다. String.match (RegExp) 또는 RegExp.exec (String)에 의해 반환 된 것과 같은 여러 인수를 그룹 수에 따라 여러 인수로받습니다.

"Hello, world!". replace (/ (\ w +), (\ w +)! /, (matchedString, first, second) => {
  console.log (먼저);
  console.log (second);
  `$ {second.toUpperCase ()}를 반환합니다 : $ {first} !!!`
})
// "세계 : 안녕하세요 !!!"

탐욕

정규 표현식은 기본적으로 욕심이라고합니다.

무슨 뜻인가요?

이 정규식을 사용하십시오.

/\$(.+)\s?/

문자열에서 달러 금액을 추출해야합니다.

/ \ $ (. +) \ s? /. exec ( '이 비용은 $ 100'입니다.) [1]
// 100

그러나 우리가 숫자 뒤에 더 많은 단어가 있다면, 그것은 놀랍습니다.

/ \ $ (. +) \ s? /. exec ( '이 비용은 $ 100이고 $ 200 미만입니다') [1] // 100이고 $ 200 미만

왜? $ 기호 뒤의 정규식은. +와 문자를 일치시키기 때문에 문자열의 끝에 도달 할 때까지 멈추지 않습니다. 그런 다음 \ s 때문에 종료됩니까? 끝 공간을 선택적으로 만듭니다.

이 문제를 해결하려면 정규식에 게으른 것을 알리고 가능한 한 적은 양의 일치를 수행해야합니다. 우리는? 수량 자 다음의 기호 :

/ \ $ (. +?) \ s / .exec ( '이 비용은 $ 100이고 $ 200 미만입니다') [1]
// 100
내가 제거? \ s 뒤에. 그렇지 않으면 공백이 선택 사항이므로 첫 번째 숫자와 만 일치합니다.

그래서? 는 위치와 수량에 따라 다른 모드를 의미합니다. 수량 자 및 지연 모드 표시 기일 수 있기 때문입니다.

Lookaheads : 다음에 따라 문자열 일치

? =를 사용하여 특정 하위 문자열이 뒤에 오는 문자열을 일치 시키십시오.

/ 로거 (? = 물) /
/ Roger (? = Waters) /. test ( 'Roger is my dog') // 거짓
/ Roger (? = Waters) /. test ( 'Roger는 내 개이고 Roger Waters는 유명한 음악가입니다.')
//참된

?! 문자열 뒤에 특정 하위 문자열이 없으면 일치하는 역 연산을 수행합니다.

/ 로거 (?! Waters) /
/ Roger (?! Waters) /. test ( 'Roger is my dog') // true
/ Roger (?! Waters) /. test ( 'Roger Waters는 유명한 음악가입니다')
//그릇된

Lookbehinds : 앞에 오는 항목에 따라 문자열 일치

이것은 ES2018 기능입니다.

Lookahead는? = 기호를 사용합니다. Lookbehinds는? <=를 사용합니다.

/ (? <= 로저) 워터스 /
/ (? <= Roger) Waters / .test ( '핑크 워터스는 내 개입니다')
//그릇된
/ (? <= Roger) Waters / .test ( 'Roger는 내 개이고 Roger Waters는 유명한 음악가입니다.')
//참된

룩백은?

/ (? 
/ (? 
/ (? 

정규 표현식 및 유니 코드

유니 코드 문자열로 작업 할 때는 u 플래그가 필수입니다. 특히, 이것은 아스트랄 플레인 (처음 1600 유니 코드 문자에 포함되지 않은)에서 문자를 처리해야 할 때 적용됩니다.

이모지가 좋은 예이지만 유일한 것은 아닙니다.

해당 플래그를 추가하지 않으면 JavaScript에 대해 이모티콘이 내부적으로 2 자로 표시되기 때문에 한 문자와 일치해야하는이 간단한 정규식이 작동하지 않습니다 (JavaScript의 유니 코드 참조).

/^.$/.test('a ') // 
/^.$/.test(' ') // 
/^.$/u.test(' ') // 

따라서 항상 u 플래그를 사용하십시오.

일반 문자와 마찬가지로 유니 코드는 범위를 처리합니다.

/[a-z]/.test('a ') // 
/[1-9]/.test('1 ') // 
/[-]/u.test(' ') // 
/[-]/u.test(' ') // 

JavaScript는 내부 코드 표현을 확인하므로 \ u1F436 <\ u1F43A <\ u1F98A이므로 < <. 전체 Emoji 목록을 확인하여 해당 코드를 얻고 순서를 찾으십시오 (팁 : macOS Emoji 선택 도구에는 여러 가지 이모지가 혼합 된 순서로 있으므로 믿지 마십시오).

유니 코드 속성 이스케이프

위에서 본 것처럼 정규 표현식 패턴에서 \ d를 사용하여 숫자를 일치시키고 \ s를 사용하여 공백이 아닌 문자를 일치 시키거나 \ w를 사용하여 영숫자 문자 등을 일치시킬 수 있습니다.

Unicode 속성 이스케이프는이 기능을 \ p {} 및 부정 \ P {}를 도입하는 모든 유니 코드 문자로 확장하는 매우 멋진 기능을 소개하는 ES2018 기능입니다.

모든 유니 코드 문자에는 일련의 속성이 있습니다. 예를 들어 스크립트는 언어 패밀리를 결정하고 ASCII는 ASCII 문자에 해당하는 부울 등입니다. 이 속성을 그래프 괄호 안에 넣을 수 있으며 정규 표현식은 해당 속성이 true인지 확인합니다.

/^\p{ASCII}+$/u.test('abc ') // 
/^\p{ASCII}+$/u.test('ABC@ ') // 
/^\p{ASCII}+$/u.test('ABC ') // 

ASCII_Hex_Digit는 문자열에 유효한 16 진수 만 포함되어 있는지 확인하는 다른 부울 속성입니다.

/^\p{ASCII_Hex_Digit}+$/u.test('0123456789ABCDEF ') //  /^\p{ASCII_Hex_Digit}+$/u.test('h') // 

대문자, 소문자, 공백, 알파벳, 이모티콘 등을 포함하여 그래프 괄호 안에 이름을 추가하여 확인하는 다른 부울 속성이 많이 있습니다.

/^\p{Lowercase}$/u.test('h ') // 
/^\p{Uppercase}$/u.test('H ') // 
/^\p{Emoji}+$/u.test('H ') // 
/^\p{Emoji}+$/u.test(' ') // 

이진 속성 외에도 특정 값과 일치하는 모든 유니 코드 문자 속성을 확인할 수 있습니다. 이 예에서는 문자열이 그리스어 또는 라틴 알파벳으로 작성되어 있는지 확인합니다.

/^\p{Script=Greek}+$/u.test('ελληνικά ') // 
/^\p{Script=Latin}+$/u.test('hey ') // 

제안서에 직접 사용할 수있는 모든 속성에 대해 자세히 알아보십시오.

문자열에 추출해야 할 숫자가 하나만 있다고 가정하면 / \ d + /는 수행해야합니다.

'Test 123123329'.match (/ \ d + /)
// 배열 [ "123123329"]

이메일 주소와 일치

간단한 방법은 \ S를 사용하여 @ 기호 앞뒤에 공백이 아닌 문자를 확인하는 것입니다.

/(\S+)@(\S+)\.(\S+)/
/(\S+)@(\S+)\.(\S+)/.exec('copesc@gmail.com ')
//["copesc@gmail.com ","copesc ","gmail ","com "]

그러나이 정규식에서 여전히 유효하지 않은 이메일이 많이 있으므로 간단한 예입니다.

큰 따옴표 사이의 텍스트 캡처

큰 따옴표로 묶은 문자열이 있고 해당 컨텐츠를 추출하려고한다고 가정하십시오.

가장 좋은 방법은 캡처 그룹을 사용하는 것입니다. 일치는 "로 시작하고 끝나는 것을 알고 있으므로 쉽게 타겟팅 할 수 있지만 결과에서 해당 인용 부호를 제거하고 싶습니다.

결과에 필요한 것을 찾을 수 있습니다 [1] :

const hello = '안녕하세요 "좋은 꽃"'
const 결과 = /"([^']*)"/.exec(hello)
// 배열 [ "\"nice flower \ "", "nice flower"]

HTML 태그 안에 내용을 가져옵니다

예를 들어 span 태그 안에 내용을 가져 와서 태그 안에 여러 개의 인수를 허용하십시오.

/]*>(.*?)<\/span>/
/]*>(.*?)<\/span>/.exec('test ')
// 없는
/ ] *> (. *?) <\ / span> /. exec ( ' test ')
// [ " test ", "test"]
/]*>(.*?)<\/span>/.exec(' 테스트  ')
// [ " 테스트 ", "test"]
JavaScript 학습에 관심이 있으십니까? jshandbook.com에서 무료 전자 책 받기