올림픽 메달 트레커의 메달 인풋 3개에
정규 표현식을 사용하려고 했다.
메달 갯수 입력하는 텍스트 박스이기 때문에
숫자만 입력할 수 있게 하고싶었다.
정규표현식 (regex):
pattern/flag로 표현
test(string) 함수는 인자로 전달된 문자열이
정규표현식의 패턴과 일치하면 true를 리턴하며
그렇지 않으면 false를 리턴
^ : 문자열의 시작
[ㄱ-ㅎ|가-힣|a-z|A-Z|0-9|]:
한글, 소문자 영어, 대문자 영어, 숫자에 해당하는 문자 1개
+: 문자 1개 이상
$: 문자열의 끝
1. 숫자만 입력되는 정규식
/[^0-9]/gi
2. 영문만 입력되는 정규식
/[^a-z]/gi
3. 한글만 입력되는 정규식
/[a-z0-9]|[ \[\]{}()<>?|`~!@#$%^&*-_+=,.;:\"'\\]/g
4. 숫자, 영문이 입력되는 정규식
/[^a-z0-9]/gi
5. 한글, 숫자만 입력되는 정규식
/[^ㄱ-ㅎ가-힣0-9]/gi
저렇게 입력해도
컴퓨터가 알아들을 수 있다는게
신기하다.
'프로젝트로 배운 공부 > 개인 프로젝트' 카테고리의 다른 글
창 크기를 처음부터 맞춰서 브라우저에 띄우는 방법 (0) | 2024.11.06 |
---|---|
리액트 링크 태그(<Link/>)와 a태그 (4) | 2024.11.05 |
리액트 링크 태그(<Link/>) 사용법 (0) | 2024.11.05 |
React 입문 (CRUD) - 2024 파리 올림픽 메달 트레커 (1) | 2024.10.16 |
CRUD 기능 (올림픽 메달 추가, 수정 및 삭제 기능) (0) | 2024.08.13 |