220626 TIL
정규식 표현사용이 반복 되면서 조금씩 이해도가 넓어지는 기분이다. javascript에서 정규식표현과 사용되는 메소드를 정리해 보려고한다.
주요 메소드
| Method | 특징 |
|---|---|
| 'string'.match(/RegExp/flag) | '정규식표현'과 매칭되는 항목을 배열로 반환 |
| 'string'.replace(/RegExp/(flag), '대체문자') | '정규식표현'에 매칭되는 항목을 대체 문자로 변환 |
| 'string'.split(/RegExp/) | '정규식표현'에 매칭되는 항목으로 쪼개어 배열로 변환 |
| (RegExp).test('string') | '정규식표현'이 매칭되면 true, 아니면 false |
| (RegExp).exec('string') | match 메서드와 유사하다고함... |
이 중 이번에는 match() 에대해서 다루려고 한다.
String.prototype.match()
구문
str.match(regexp)결과값
문자열(str)이 정규식과 일치하면 일치하는 전체 문자열을 첫 번째 요소로 포함하는 배열을 반환한 다음 괄호 안에 캡처된 결과가 나온다고 한다. 일치하는 것이 없을 경우 null이 반환된다고 한다.
설명
정규식에 g플래그가 없는 경우, RegExp.exec()과 같은 결과를 반환한다고 한다. 그렇다면 RegExp.exec() 결과는 무엇인가??
let str = "dog, dogfood, hotdog";
let regexp1 = RegExp('dog','g')
let s1 = str.match(regexp1)
console.log(s1) //[ 'dog', 'dog', 'dog' ]
let regexp2 = RegExp('dog','')
let s2 = str.match(regexp2)
console.log(s2)
//[ 'dog', index: 0, input: 'dog, dogfood, hotdog', groups: undefined ]RegExp.prototype.exec()
배열 방식 익숙한 match()에서 갑자기 index가 나오고, input이 등장해서 많이 당황스러웠다.
구문
regexObj.exec(str)반환 값
정규 표현식이 일치하면, exec()에 배열을 반환하고, 정규 표현식 객체의 속성을 업데이트 한다고 한다. 반환하는 배열은 일치하는 텍스트를 첫 번째 원소로, 각각의 괄호 갭처 그룹을 이후 원소로 포함 한다고 한다. 검색에 실패할 경우 null을 반환한다고 한다. 예시로 보자.
let s = 'The dog or domestic dog is a domesticated descendant of the wolf'
let re1 = /domestic\s(dog).+(descendant)/g
let result1 = re1.exec(s);
console.log(result1)
/*
[
'domestic dog is a domesticated descendant',
'dog',
'descendant',
index: 11,
input: 'The dog or domestic dog is a domesticated descendant of the wolf',
groups: undefined
]
*/
let result2 = re1.exec(s)
console.log(result2) //null-
result[0]
일치한 전체 문자가 나온다. -
result[1]~[n]
()괄호에 있는 그룹이 적용된 부분 문자열이 나온다.(여기서는 'dog', 'descendant'이다.) -
index
일치하는 문자열이 시작하는 인덱스이다. -
input
원본 문자열 이다. -
groups
내부 객체라고 생각되며, 사용법은 아래 링크에 있다. 사용목적은 모르겠다 ㅠ.
Groups and ranges, MDN
또한, RegExp 객체에 정보가 추가 된다. 아래 예시를 보자.
let str = "dog, dogfood, hotdog";
let regexp1 = RegExp('(?<dog>dog)','ig')
let a1 = regexp1.exec(str)
/*
[
'dog',
'dog',
index: 0,
input: 'dog, dogfood, hotdog',
groups: [Object: null prototype] { dog: 'dog' }
]
*/
console.log(regexp1.lastIndex) //3
console.log(regexp1.ignoreCase) //true
console.log(regexp1.multiline) //false
console.log(regexp1.global) //true
console.log(regexp1.source) //'(?<dog>dog)'위 예시에서 RegExp 객체인 'regexp1'에 대해서 알아보자.
- lastIndex
다음 일치를 시작할 인덱스에 대한 정보이다. 다음 검색할 시작위치라고 이해했다. - ignoreCase
i플래그 유무이다. - global
g플래그 유무이다. - multiline
m플래그 유무이다. - source
패턴 문자열이다.
마치면서
match()에서 플래그 없을 경우에 대해서 알아봤다. 알고리즘 레퍼런스를 보면 가끔 사용하는 경우가 있어서 참고하였다. 자꾸 블로그가 밀리넹 ㅠ
참조
[String.prototype.match(), MDN, 2022년06월26일]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/match
[[자바스크립트] 정규표현식(Regular Expression) 기초/기본 쉽고 상세한 사용 방법 정리(샘플 예제 코드),[카레유:티스토리], 2022년07월01일]
https://curryyou.tistory.com/234
[RegExp.prototype.exec(), MDN, 2022년07월01일]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec
