오전에 알고리즘을 훑다보니 정규식 표현에 관해서 적용할 일이 있었다. 수업기간에 잠깐 잠깐 써먹을 일은 있었지만 거의 모르는 것과 같기때문에 복습한다는 생각으로 다시 알아보았다.
정규 표현식(Regular Expression)은 문자열에서 특정 문자 조합을 찾기위한 패턴이라고 한다.
Javascript에서는 정규 표현식도 객체라고 한다. 정규표현식은 두가지 방법으로 만들수 있다고 한다.
정규표현식은 두 가지 방법으로 만들 수 있다고 한다.
리터럴
표기법 이라고 하며 다음과 같이 슬래시로 패턴을 감싸서 작성 한다고 한다.cosnt regExp = /ab+c/
cosnt regExp = new RegExp('ab+c')
생성자 호출 방법이라고 RegExp 객체를 호출 하였는데 사실 괄호안으로 리터럴
표기법을 사용하면, 표현식을 평가할 때 컴파일 한다고 한다. 그렇기 때문에 패턴이 변할 가능성이 있을 경우에는 생성자 호출 방법을 사용하여야한다고 한다.
let s = "12345"
let regexp1 = new RegExp(/1/,"g") // 리터럴 표기법
for(let i = 1; i <= 5; i++){
let bb = s.match(regexp1)
console.log(bb)
}
//[ '1' ]
//[ '1' ]
//[ '1' ]
//[ '1' ]
//[ '1' ]
//변수 발생시 아래와 같은 방식으로 사용한다.
for(let i = 1; i <= 5; i++){
let regexp2 = new RegExp(`${i}`,"g")
let aa = s.match(regexp2)
console.log(aa)
}
ECMAScript 5에서는 생성자 호출할 때 리터럴 표기시 플래그를 같이 넣으면 'TypeError'가 발생하였는데, ECMAScript 6부터는 발생하지 않는다고 한다.
let regexp1 = new RegExp(/1/gm,"g")
console.log(regexp1) // /1/g
이건 정규표현식과는 거리가 있었지만, replace 메소드에서 새롭게 알게된 사용방법이 있어서 추가하였다.
let regexp3 = new RegExp(/(\w+)\s(\w+)/,"g")
let ss = "Parker Park"
let newss = ss.replace(regexp3, '$2 $1')
우선 RegExp 를 설명 하자면,
1. \w : 알파벳, 숫자, 언더스코어(_)를 일치시킨다는 의미이다.
2. + : 최소 한개 이상을 의미한다.
3. () : 괄호는 그룹을 의미한다.
4. \s : 공백을 의미한다.
replace 메소드에서 매개변수가 String이고 replace 메소드에서 특수 교체 패턴을 가지고 있다고 한다.
Pattern | Inserts |
---|---|
$n | n이 1이상 99이하의 정수라면, 첫번째 매개변수로 넘겨진 RegExp객체에서 소괄호로 묶인 n번째의 부분 표현식으로 매치된 문자열을 삽입한다고 한다. |
다른 사용법도 있으니 참조란 또는 MDN을 참조 바란다.
내용이 많지만 다 다룰 수 없어서 ㅠ 아래 참조 링크를 참조 바란당.
[정규표현식 , 더이상 미루지 말자 🤩, 드림코딩 YouTube, 2022년06월13일 접속]
https://youtu.be/t3M6toIflyQ
[RegExp , MDN, 2022년06월13일 접속]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp
[정규 표현식 , MDN, 2022년06월13일 접속]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Regular_Expressions
[String.prototype.replace() , MDN, 2022년06월13일 접속]
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/replace
[[자바스크립트] 정규표현식(Regular Expression) 기초/기본 쉽고 상세한 사용 방법 정리(샘플 예제 코드) ,[카레유:티스토리], 2022년06월13일 접속]
https://curryyou.tistory.com/234