20220211_TIL : 정규표현식

만약 회원가입이나 로그인, 비밀번호 설정 등 텍스트를 검증 할 상황에서 정확히 입력됐는 지 확인하기위해 조건을 제시하려면 대표적으로 .includes와 같은 메서드를 사용해야하는데 많은 조건을 설정하기에 코드가 길어지고 번거로워진다.

이 때 사용할 수 있는 유용한 자바스크립트 기능이 바로 정규표현식이다.

\조건\.test(확인할 대상)
기본적으로 슬래시()안에 조건을 적고 .test할때 확인할 대상을 적어준다.
대상이 적힌 조건에 부합하는지 boolean으로 반환한다.

\w : 문자
\d : 숫자
\w+ : 하나 이상의 문자
. : 모든 문자(!,*,r 모두를 의미)
\.\ : 문자열 "."
\w{3,4} : 문자열 3개 혹은 4개 - 번호 입력 검증에 사용 가능
^\w$ : 문자열 시작(^)과 끝($) - 검증할 부분에 숫자나 특수문자가 들어갈 경우 false
[0-9A-Z] : 숫자와 대문자
x(?=y) : x뒤에 y만 위치

비밀번호를 검증한다고 가정했을 때,

❓ 비밀번호 체크?

1. 첫 문자가 영문자로 시작해야 한다.
2. 총 길이는 8글자 이상 16글자 이하여야 한다.
3. 비밀번호에 숫자가 하나 이상 들어와 있어야 한다.
4. 비밀번호에 특수문자가 하나 이상 들어와 있어야 한다.

// 정규 표현식 : 비밀번호 체크
/^(?=.*[a-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,20}$/.test( 비밀번호 )

정규 표현식 상세 자료 참고 - MDN 정규표현식

👩🏻‍💻 오늘의 TIL ...

간단한 조건이 아닐 경우 정규표현식을 이용해 한 줄로 코드를 작성할 수 있는 장점이 있지만 코드 자체로만 봤을 때 해석하기 쉽지않아보였다.

✔️ Context-API와 글로벌 스테이트 개념 체크
✔️ 정규표현식 연습