Regex의 실제 응용 프로그램

5782 단어 programmingjavascript
정규식은 이해하기 어렵고 배우기도 어렵습니다. 그러나 그들은 매우 강력하고 실제 세계에서 많은 사용 사례를 가지고 있습니다. 이 게시물에서는 정규식의 몇 가지 실용적인 응용 프로그램을 살펴보겠습니다.


양식 필드 유효성 검사



정규식의 가장 일반적인 사용 사례 중 하나는 이메일, 사용자 이름, 신용 카드 번호, 전화 번호, 날짜, 암호 강도 등과 같은 양식 필드의 유효성을 검사하는 것입니다.

다음 예제는 이메일 형식의 유효성을 검사하는 정규식입니다.

const emailValidatorRegex = /^[^@\s]+@[^@\s]+\.[^@\s\.]{2,}$/

function isValid(email) {
    if emailValidatorRegex.test(email) {
        return true
    } else {
        return false
    }
}

isValid('[email protected]') // true 
isValid('dummyemail@gmail') // false



찾기 및 바꾸기



Regex는 복잡한 찾기 및 바꾸기 기능을 작성하는 데 사용할 수 있습니다. 정규식을 사용하여 VSCode와 같은 내부 편집기를 찾고 바꿀 수도 있습니다.

다음 예제는 모든 일반 자바스크립트 함수 선언을 취하여 화살표 함수로 바꿉니다.

const normalFunction = `
function add(x, y) {
    return x + y
}
`

const arrowFunction = normalFunction.replace(/function\s*(\w+)\s*\(([^\)]+)\)/g, "const $1 = ($2) =>")

console.log(arrowFunction)
/*
const add (x, y) => {
    return x + y
}
*/


다음은 이것을 사용하여 VSCode에서 찾고 바꾸는 방법입니다.




HTML 파싱



정규식의 또 다른 사용 사례는 HTML과 같은 것을 구문 분석하는 것입니다. 일부 HTML에서 이미지 소스를 추출하거나 Google 검색 결과에서 모든 URL을 추출하고 싶을 수 있습니다.

HTML이 있고 <li> 안에 있는 모든 것을 추출하여 배열에 넣고 싶다고 가정해 보겠습니다. 우리가 이것을 할 수 있는 방법은 다음과 같습니다.

const markup = `
<html>
  <body>

    <h1>Shopping List</h1>

    <h2>Produce</h2>
    <ul>
      <li>Celery</li>
      <li>Apples</li>
    </ul>

    <h2>Frozen</h2>
    <ul>
      <li>Ice Cream</li>
      <li>Hot Pockets</li>
    </ul>

  </body>
</html>
`

const listParser = /(?<=<li>)(\w|\s)+(?=<\/li>)/gm

const shoppingList = markup.match(listParser)

console.log(shoppingList)
// [ 'Celery', 'Apples', 'Ice Cream', 'Hot Pockets' ]



결론



정규 표현식으로 할 수 있는 일이 너무 많습니다. 그러나 그것들이 모든 것에 대한 해결책은 아닙니다. 강력한 기능과 유연성에도 불구하고 다른 개발자가 가장 읽기 쉬운 것은 아닙니다.

문자열에서 공백을 제거하는 것과 같은 작업을 위해 손을 뻗지 않을 수도 있습니다. 이를 위한 문자열 메서드나 기본 함수가 있습니다. 그러나 복잡한 검색, 찾기 및 바꾸기, 유효성 검사 및 구문 분석의 경우 정규식은 훌륭한 솔루션입니다. 게다가 쓰기도 재미있습니다!


정규식을 배우고 싶습니까?

내 대화식 과정을 확인하십시오: https://www.slip.so/courses/regular-expresssions-in-javascript

업데이트를 위해 Twitter에서 저를 팔로우하세요:
Azure의 Grafana – Azure MySQL 스토리지
XSY3244 10.31 D

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage