JavaScript에서 Regex로 여러 항목 일치

1. JavaScript의 정규 표현식
2. RegExp.prototype.exec()를 사용하여 JavaScript에서 Regex와 여러 항목 일치
3. String.prototype.search()를 사용하여 JavaScript에서 Regex와 여러 항목 일치
4. String.prototype.matchAll()을 사용하여 JavaScript에서 Regex로 여러 항목 일치

이 기사에서는 JavaScript의 정규식과 JavaScript에서 여러 항목을 일치시키는 방법에 대해 배웁니다.

JavaScript의 정규 표현식

정규식은 검색 패턴을 생성하는 일련의 문자입니다. 텍스트에서 데이터를 검색하는 동안 이 검색 패턴을 사용하여 찾고 있는 내용을 전달할 수 있습니다.

정규식은 단일 문자만큼 기본적일 수도 있고 전체 패턴만큼 복잡할 수도 있습니다. 정규식을 사용하여 텍스트 검색 또는 텍스트 교체 작업을 수행할 수 있습니다.

정규식은 검색 기능을 크게 향상시킬 수 있는 잠재력이 있습니다.

RegExp.prototype.exec()를 사용하여 JavaScript에서 Regex와 여러 항목 일치

exec() 함수는 주어진 문자열에서 일치 항목을 검색합니다.

통사론:

exec(str)

매개변수:

• str: 정규 표현식과 일치시켜야 하는 문자열입니다.

반환 값:

• 일치에 성공하면 exec() 함수는 배열을 반환하고 정규식 개체의 lastIndex 속성을 수정합니다. 일치하는 텍스트는 반환된 배열의 첫 번째 항목이며 일치하는 텍스트의 각 괄호 캡처 그룹에 대해 하나의 항목이 뒤따릅니다.
• 일치에 실패하면 exec() 함수는 null을 반환하고 lastIndex를 0으로 변경합니다.

global 또는 sticky 플래그가 JavaScript RegExp 개체에 설정되면 상태가 저장됩니다. 이전 경기의 lastIndex를 저장합니다.

내부적으로 exec()는 텍스트 문자열(캡처 그룹 포함)에서 여러 일치 항목을 반복하는 데 사용할 수 있습니다.

예:

const regex1 = RegExp('hello*', 'g');
const str1 = 'table hello, hello world';
let array1;

while ((array1 = regex1.exec(str1)) !== null) {
  console.log(`Found ${array1[0]}. Next starts at ${regex1.lastIndex}.`);
}

출력:

"Found hello. Next starts at 11."
"Found hello. Next starts at 18."

이 링크를 통해 위의 코드 세그먼트에 액세스할 수도 있습니다.

g 플래그를 지정하여 연속 일치 항목 찾기

정규식에 g 플래그를 지정하면 종종 exec() 함수를 사용하여 정확한 텍스트에서 후속 일치 항목을 찾을 수 있습니다.

정규 표현식의 lastIndex 속성이 제공하는 str의 하위 문자열에서 검색이 시작됩니다(test()는 lastIndex 속성으로 이동합니다).

다른 텍스트를 찾을 때 lastIndex 속성은 재설정되지 않습니다. 대신 현재 lastIndex에서 검색이 시작됩니다.

예:

let myRe = /ab*/g;
let str = 'abbcdefabh';
let myArray;
while ((myArray = myRe.exec(str)) !== null) {
  let msg = 'Found ' + myArray[0] + '. ';
  msg += 'Next match starts at ' + myRe.lastIndex;
  console.log(msg);
}

출력:

"Found abb. Next match starts at 3"
"Found ab. Next match starts at 9"

이 링크를 통해 위 코드 세그먼트의 데모에 액세스할 수 있습니다.

RegEx 리터럴과 함께 exec() 사용

RegExp 객체를 명시적으로 생성하지 않고 exec()를 사용할 수도 있습니다.

예:

let matches = /(hello \S+)/.exec('This is a hello world!');
console.log(matches[1]);

출력:

"hello world!"

이 링크를 통해 위 코드 세그먼트의 데모에 액세스할 수 있습니다.

String.prototype.search()를 사용하여 JavaScript에서 Regex와 여러 항목 일치

search() 메서드는 정규식과 이 String 개체 간의 일치 검색을 완료합니다.

통사론:

search(regexp)

매개변수:

• regexp: It is a regular expression object. If a non-RegEx object regexp is executed, it is implicitly converted to a RegExp with new RegExp(regexp).

반환 값:

• 일치하는 항목이 있으면 정규 표현식과 제공된 문자열 사이의 첫 번째 일치 항목 인덱스를 반환하거나 일치 항목이 없으면 -1을 반환합니다.

예:

const paragraph =
    'The swift brown fox leaps over the sluggish dog. Was the dog truly sluggish if it barked??';

const regex = /[^\w\s]/g;

console.log(paragraph.search(regex));

console.log(paragraph[paragraph.search(regex)]);

출력:

43
"."

이 링크를 통해 위 코드 세그먼트의 데모에 액세스할 수 있습니다.

String.prototype.matchAll()을 사용하여 JavaScript에서 Regex로 여러 항목 일치

matchAll() 함수는 정규식에 대해 문자열과 일치하는 모든 결과의 반복자를 제공합니다. 여기에는 캡처 그룹이 포함됩니다.

통사론:

matchAll(regexp)

매개변수:

• regexp: 정규 표현식이 있는 개체입니다.

  비 RegEx 객체 obj가 제공되면 new RegExp(obj).를 사용하여 묵시적으로 RegExp로 전환됩니다. RegExp 개체에 /g 플래그가 없으면 TypeError가 발생합니다.

반환 값:

• 일치하는 반복자(다시 시작 가능한 반복 가능 항목이 아님)를 반환합니다.
• 각 일치 항목은 배열입니다(추가 속성 index 및 input 포함). 일치 배열에는 첫 번째 항목으로 일치하는 텍스트가 있고 일치하는 텍스트의 각 괄호 캡처 그룹에 대해 하나씩 있습니다.

예 1:

const regexp = /t(e)(st(\d?))/g;
const str = 'test1test2';

const array = [...str.matchAll(regexp)];

console.log(array[0]);

console.log(array[1]);

출력:

["test1", "e", "st1", "1"]
["test2", "e", "st2", "2"]

이 링크를 통해 위 코드 세그먼트의 데모에 액세스할 수 있습니다.

예 2:

function checkMultipleOccurrences(sentence) {
  var matchExpression = /(JavaScript?[^\s]+)|(typescript?[^\s]+)/g;
  return sentence.match(matchExpression);
}
var sentence =
    'This is my first JavaScript Program which is the subset of typescript';
console.log(sentence);
console.log(checkMultipleOccurrences(sentence));

출력:

"This is my first JavaScript Program which is the subset of typescript"
["JavaScript", "typescript"]

이 링크를 통해 위 코드 세그먼트의 데모에 액세스할 수 있습니다.

위에서 언급한 코드를 실행하려면 다음 명령을 사용하십시오.

node fileName.js.