[JavaScript] 정규표현식 (Regular Expression)

Dico·2020년 9월 25일
0

[JavaScript]

목록 보기
10/21

알고리즘 문제 하나를 붙들고 3시간을 쩔쩔매다가 정규표현식을 사용해야 수월하게 풀리는 문제인 걸 알게되었다 😂
난해한 비주얼을 보고 학습을 계속 미루고 있었지만 지금부터는 기억해야 할 내용들을 예시위주로 정리해보려 한다❗️


정규표현식이란?

정규표현식 (Regular Expression):
줄여서 RegExp; 문자열(String)에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴이다. 이 또한 객체이며, 이 패턴들은 RegExp의 exec 메소드와 test 메소드 ,그리고 String의 match메소드 , replace메소드 , search메소드 , split 메소드와 함께 쓰인다.
-MDN

위에서 정의된 내용처럼, 정규표현식은 문자열에서 특정 내용을 찾거나 대체 또는 발췌하는데 사용된다.

사용방법

/내용/처럼 찾고자 하는 내용을 슬래쉬로 감싼다.

regexObj.test(str)

.test()메소드를 통해 슬래쉬 내부의 내용과 정확히 일치하는 내용이 문자열에 존재하는 지 Boolean으로 결과를 반환받을 수 있다.

//.test() 사용
let hannahIsHiding = "Somewhere Hannah is hiding in this text.";
let hannahRegex = /Hannah/;
let result = hannahRegex.test(hannahIsHiding);    
console.log(result);                  //true

hannahIsHiding내부에서 "Hannah"를 찾는 예시이다.
정확히 일치하는 내용이 있기 때문에 resulttrue를 반환한다.

주의할 점은, "Hannah"만 검색될 뿐, "hannah""HANNAH"일치하는 결과로 보지 않는다는 것이다.

패턴 사이사이에 |를 넣어 한 번에 여러 개의 패턴을 검색하는 것도 가능하다.

let petString = "James has a pet cat.";
let petRegex = /dog|cat|bird|fish/;   //"cat"이 matching된다!
let result = petRegex.test(petString);
console.log(result);                  //true

하나의 패턴이라도 매칭되는 내용이 있다면 true를 반환한다.

str.match(regexp)

혹은 하단의 예시처럼 .match() 메소드를 통해서도 검색이 가능하다.

//.match() 사용
let hannahIsHiding = "Somewhere Hannah is hiding in this text.";
let hannahRegex = /Hannah/;
let result = hannahIsHiding.match(hannahRegex);  
console.log(result);                  //["Hannah", index: 10, input: "Somewhere Hannah is hiding in this text.", groups: undefined]

.test() 메소드와 .match()메소드는 검색대상과 값의 순서가 반대로 쓰인다. 이번에는 hannahRegex.match()의 인자로 들어가는 것을 주목해야 한다.
그리고 .match()는 실행결과로 배열을 반환한다.

.(Wildcard Period)

마침표(.)를 이용하면 (부분적일지라도) 해당 패턴을 가진 문자를 전부 매칭한다. 예를 들어, "dog", "fog", "log", "jog"에 모두 패턴을 매칭하고 싶다면 마지막에 .를 붙여 /og./로 검색할 수 있다.

let exampleStr = "Let's have fun with regular expressions!";
let unRegex = /un./;
let result = unRegex.test(exampleStr);
console.log(result);                 //true

플래그 (Flag)

정규표현식에서는 플래그(Flag)를 패턴 뒤에 붙여 검색에 세부옵션을 추가할 수 있다.

플래그 종류:

  • i (Ignore case): 대소문자를 구별하지 않고 검색한다.
  • g (Global): 문자열 내 매칭되는 모든 패턴을 검색한다.
  • m (Multi Line): 문자열의 행이 바뀌어도 검색을 이어간다.
    -https://poiemaweb.com/
let myString = "Coding is extremely fun";
let myRegex = /ExTRemElY/i;        //<-대소문자 구별없이 검색
let result = myRegex.test(myString);
console.log(result);               //true

이렇게 i플래그를 사용해 대소문자 구분 없이 검색하거나,

let twinkleStar = "Twinkle, twinkle, little star";
let starRegex = /Twinkle/gi;       //<-매칭되는 모든 패턴을 대소문자 구별없이 검색
let result = twinkleStar.match(starRegex); 
console.log(result);               //['Twinkle', 'twinkle']

여러개의 플래그(gi; 순서는 상관 없음)를 같이 사용해서 검색할 수도 있다.


Reference

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/match
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/%EC%A0%95%EA%B7%9C%EC%8B%9D
https://poiemaweb.com/js-regexp

profile
프린이의 코묻은 코드가 쌓이는 공간

0개의 댓글