Language/JavaScript

[JavaScript] str.match() - 문자열에 원하는 특정 문자열 혹은 정규식과 매치되는 문자열 찾기

썸머워즈 2022. 5. 27. 09:18
반응형

String.prototype.match() 메서드는 제목 그대로 기준 문자열에서 원하는 특정 문자열 혹은 정규식과 매치되는 부분을 찾아주는 메서드이다.

 

▷ 구문

str.match(regexp)

regexp: 정규식 개체이며, 정규표현식이 아닌 객체가 전달되면 암묵적으로 정규표현식(RegExp)으로 변환된다.


▷ 예제 1) String.prototype.match() 기본 사용법

let str = 'Hello my blog, My blog name is mine-it-record'

// 1. 정규표현식 글로벌 플래그(g) 없이 사용하기
str.match(/name is [a-z]{4}-it/i);
// [
//     'name is mine-it',
//     index: 23,
//     input: 'Hello my blog, My blog name is mine-it-record',
//     groups: undefined
// ]

// 2. 정규표현식 글로벌 플래그(g) 같이 사용하기
str.match(/my/gi);
// ['my', 'My']

// 3. 매개변수 없이 사용하기
str.match();
// [
//     '', 
//     index: 0, 
//     input: 'Hello my blog, My blog name is mine-it-record', 
//     groups: undefined
// ]

// 4. 기타 표현
let str1 = "NaN means not a number. Infinity contains -Infinity and +Infinity in JavaScript.",
    str2 = "My grandfather is 65 years old and My grandmother is 63 years old.",
    str3 = "The contract was declared null and void.";
str1.match("number");   // "number"는 문자열임. ["number"]를 반환함.
str1.match(NaN);        // NaN 타입은 숫자형임. ["NaN"]을 반환함.
str1.match(Infinity);   // Infinity 타입은 숫자형임. ["Infinity"]를 반환함.
str1.match(+Infinity);  // ["Infinity"]를 반환함.
str1.match(-Infinity);  // ["-Infinity"]를 반환함.
str2.match(65);         // ["65"]를 반환함
str2.match(+65);        // 플러스 기호가 붙은 숫자형. ["65"]를 반환함.
str3.match(null);       // ["null"]을 반환함.


String.protytype.match() 메서드를 사용할 때 정규표현식 글로벌 플래그(g)를 사용하지 않게 되면 주석으로 보는 것처럼 str.match()[0] 이 결과 값, str.match().index 가 해당 결과가 위치한 인덱스 등의 정보를 반환해준다.

그러나 글로벌 플래그(g)를 사용하게 되면 단순하게 결과 목록만 보여준다.

 

정규표현식 자체의 메서드인 test(), exec() 등이 존재하기 때문에 상황에 따라 맞춰 사용하면 좋을 것 같다.

(나 같은 경우에도 뭔가 정규표현식에 맞는 문자열의 개수를 찾을 때만 주로 사용하고는 했다.)


참고: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match

 

String.prototype.match() - JavaScript | MDN

The match() method retrieves the result of matching a string against a regular expression.

developer.mozilla.org

반응형