문자 하나가 아니라 조건에 해당하는 붙어있는 여러개의 문자를 찾는다는 것이 핵심이다. *, + 의 차이를 이해해야 한다.

• • 는 없는 경우가 포함되고
• +는 무조건 하나는 있어야 한다는 의미다.

다음으로 탐욕적 수량자와 게으른 수량자를 이해해야 한다. 이 부분은 매우 중요하면서도 처음엔 어려울 수 있는 부분이다.

• 탐욕적 수량자의 핵심은 조건에 맞지 않을 때까지 하나의 패턴으로 인식하는 것이고

  • <b>.*</b>
    • <b>BOLD!</b><hr><b>BOLD!</b>
  • /pass/*
    • passagers
  • /ble?/
    • scrambled, publishing
  • <b>와 마지막의 </b> 사이에 연속된 문자들을 찾습니다.
  • Text에 일치된 내용을 보시게 되면, <b>와 가장 마지막의 </b> 사이에 있는 연속된 문자를 찾으려 하기 때문에 전체가 일치하는 것

• 게으른 수량자의 핵심은 조건에 맞으면 욕심부리지 말고 거기서 끝내는 것이다.

  • <b>.+?</b>
    • <b>BOLD!</b><hr><b>BOLD!</b>
  • /pass?/*
    • passagers
  • /ble??/
    • scrambled, publishing
  • 최소의 문자 덩어리만 일치합니다. <b> 뒤에 연속된 문자들이 등장하다 처음으로 </b> 태그를 만날때까지 일치하는 것

• 패턴

  • 패턴 **{}**은 위에서 봤던 패턴 ***, *?, +, +?**의 확장판
    • • : {0, }
    • *? : {0}
    • • : {1, }
    • +? : {1}
    • 예제
      • /pas{0,1}/g
      • passagers, pagemaker

• 캡쳐링 그룹(capturing group)

  • 문자열(String) 객체가 가지고 있는 match/replace 결과값으로 활용이 가능하다.

  const ko = 'kokokoko';
  const koooo = 'kooookoooo';
  
  ko.match(/ko+/);
  // ["ko", index: 0, input: "kokokoko", groups: undefined]
  koooo.match(/ko+/);
  // ["koooo", index: 0, input: "kooookoooo", groups: undefined]
  
  ko.match(/(ko)+/);
  // ["kokokoko", "ko", index: 0, input: "kokokoko", groups: undefined]
  koooo.match(/(ko)+/);
  // ["ko", "ko", index: 0, input: "kooookoooo", groups: undefined]
  

  • 그룹화된 **"ko"**를 패턴 **+**로 1회 이상 연속으로 반복하여 검색하여 **"kokokoko"**를 반환
  • 캡처된 **"ko"**로 검색하여 **"ko"**를 반환

  // not capturing group -> match
  var url = '<https://ggg.github.com>'
  var domain = /https?:\\/\\/\\w+\\.github.com/
  url.search(domain) // 0
  url.match(domain) // ["<https://ggg.github.com>", index: 0, ...]
  
  // capturing group -> match
  var url = '<https://ggg.github.com>'
  var domain = /https?:\\/\\/(\\w+)\\.github.com/
  url.search(domain) // 0
  url.match(domain) // ["<https://ggg.github.com>", "ggg", index: 0, ...]
  
  // capturing group -> replace
  'ggg.github.com'.replace(/^\\w+(\\.github\\.com)$/, 'www$1')
  // www.github.com
  

• 논-캡쳐링 그룹(non-capturing group)

  • 그룹 시작 부분에 ?: 기호를 추가하면 non-capturing 그룹이 됩니다.
  • 사용이유: 포함/미포함 된 문자열을 모두 매칭시키면서 포함된 그룹문자열은 배열에 포함하지 않기 위해서 추가됩니다.

  // capturing group
  'javascript'.replace(/(java)(script)/, `$2-$1`) // script-java
  
  // non-capturing group
  'javascript'.replace(/(java)(?:script)/, `$2-$1`) // "$2-java"
  
  // capturing group
  /(https\\/\\/)?(\\w+)\\.github.com/.exec('<https://gg.github.com>')
  ["<https://gg.github.com>", "https://", "gg", index: 0, ...]
  
  /(?:https?:\\/\\/)?(\\w+)\\.github.com/.exec('<https://gg.github.com>')
  // ["<https://gg.github.com>", "gg", index: 0, ...]
  
  // non-capturing group
  /(?:https?:\\/\\/)?(\\w+)\\.github.com/.exec('gg.github.com')
  // ["gg.github.com", "gg", index: 0, ...]
  
  

• Lookahead

  • Lookahead도 그룹 패턴으로, Lookahead 그룹 안에 있는 패턴이 뒤에 올 때만 매칭(전방탐색)이 된다
  • 캡쳐링 그룹과 다른 점은 전체 매칭 결과에 Lookahead 그룹 안에 있는 패턴이 포함되지 않는다

  // capturing group
  /java(script)/.exec('javascript') // ["javascript", "script", index: 0, ...]
  
  // positive lookahead -> 전방 탐색
  /java(?=script)/.exec('javascript') // ["java", index: 0, ...]
  
  // negative lookahead -> 부정형 전방 탐색
  // 그룹안에 패턴이 뒤에 오지 맣아야 함을 의미
  /java(?!script)/.exec('java coffee') // ["java", index: 0, ... ]
  

• Lookbehind

  • Lookahead와 정반대의 역할을 하며 그룹 안의 패턴이 앞에 나올 때 매칭이 된다.
  • Lookbehind도 positive, negative가 있으며, positive lookbehind는 ?<=, negative lookbehind는 ?<! 기호로 표현한다.캡쳐링 그룹과 다른 점은 전체 매칭 결과에 Lookahead 그룹 안에 있는 패턴이 포함되지 않는다

  // capturing group
  /java(script)/.exec('javascript') // ["javascript", "script", index: 0, ...]
  
  // java 다음에 script가 와야 한다. -> 후방 탐색
  /(?<=java)script/.exec('javascript') // ["script", index: 6, ...]
  
  // negative lookahead -> 부정형 후방 탐색
  // java가 아닌 문자열 다음에 script가 와야 한다.
  /(?<!java)script/.exec('purescript') // ["script", index: 4, ...]
  

대표적으로 많이 사용하는 정규식