[javascript] Regular Expression

dev stefanCho·2021년 7월 31일
0

javascript

목록 보기
14/26

Regex 정리

Useful Patterns


// time
const time = /^(?:\d{1,2})(?::([0-5]?\d))?:(?:[0-5]?\d)?$/g

// Korean, English, ~
const pattern = /^[ㄱ-ㅎㅏ-ㅣ가-힣A-z0-9~]*$/;

match


match는 string에서 특정 패턴을 extract하는 것이다.

extracting all matches (repeated matches)

let song = "La La LoL La";
let regex = /La/g;
let result = song.match(regex); // ['La', 'La', 'La']

// negative single match

let word = "Gut Put But";
let regex = /[^G]ut/g;
let result = word.match(regex); // ['Put', 'But']

lazy match vs greedy match

// greedy match (default behavior)
let str = "<h1>Hello World</h1>";
let regex = /<.*>/;
let result = str.match(regex); // <h1>Hello World</h1>

// lazy match
let str2 = "<h1>Hello World</h1>";
let regex2 = /<.*?>/;
let result2 = str2.match(regex2); // <h1>

specifiy number of match

let str = "C123P123";
let regex = /C\d{1,2}/; // 최소 1개 ~ 최대 2개
let result = str.match(regex);

let str2 = "C123P123";
let regex2 = /C\d{2,}/; // 1개 이상 (greedy match)
let result2 = str2.match(regex2);

let str3 = "C123P123";
let regex3 = /C\d{2}/; // 정확히 2개
let result3 = str3.match(regex3);

match capture pattern

\number 형태는 정확히 n번째 capture group의 값을 가져온다.

let str = "C123 C123";
let regex = /([A-Z]\d{3})\s\1/;
let result = str.match(regex); // ['C123 C123', 'C123]

let str = "C123 D123";
let regex = /([A-Z]\d{3})\s\1/; // capture된 1번째(\1) 그룹의 값은 C123이다.
let result = str.match(regex); // null

positive, negative look ahead

look ahead는 항상 ?으로 시작한다.

// positive look ahead
let str = "gu";
let regex = /g(?=u)/;
let result = str.match(regex); // ['g']

// negative look ahead
let str = "gx";
let regex = /g(?!u)/;
let result = str.match(regex); // ['g']

matchAll, exec


String.prototype.matchAll()
RegExp.exec()

  • capturing group을 가져온다.
  • exec에는 g flag가 자동 적용된다. (matchAll의 regex에는 /g 가 필요하다.)
let str = 'stefan 01012341234 / 2021-01-01'
let regex = /(.*\s)(\d*)(\s.*)/

console.log(regex.exec(str))
console.log([...str.matchAll(regex)])
// 결과
// ["stefan 01012341234 / 2021-01-01", "stefan ", "01012341234", " / 2021-01-01", index: 0, input: "stefan 01012341234 / 2021-01-01"]

replace


string의 매칭된 패턴을 다른것으로 변경하는 것이다.

replace(regexp, newSubstr)
replace(regexp, replacerFunction)
replace(substr, newSubstr)
replace(substr, replacerFunction)

regexp 혹은 substr으로 찾고, substr혹은 function으로 대체할 수 있다.
function의 경우 return값으로 대체하는 것이다.

앞뒤 white space를 제거하기

let foo = "          Hello,  World!!        ";
let regex = /^\s+|\s+$/g;
let result = foo.replace(regex, '');
// 매칭된 앞뒤 white space를 빈 문자열로 바꿈

RegExp와 forward slash pattern( // ) 비교

RegExp는 constructor이다. 따라서 new RegExp(어떤 String) 형태로 쓰인다.
/어떤 Pattern/ 형태도 RegExp와 기능은 똑같다.

차이점

RegExp에서는 backslash(\)에 평소와 같은 룰을 적용한다는 것이다. (즉 RegExp는 파라미터를 string 있는 그대로 본다.)
//에서는 \가 regular expression의 special character로 만들어준다.

Example

let regexp = new RegExp('a\w'); // aw 패턴으로 본다. 
regexp.test('aW'); // false

let regexpWithForwardSlash = /a\w/ // a\w 패턴으로 본다.
regexpWithForwardSlash.test('aW'); // true

regexp는 \일반적인 escape룰을 적용한다.
regexpWithForwardSlash는 special character가 적용된다.

profile
Front-end Developer

0개의 댓글