React/Form Validation (3) 썸네일형 리스트형 [React] Form 유효성 검사 : 정규식 Regex 의미와 패턴표 정규표현식 (Regex) 정규표현식(正規表現式, Regular Expression)은 문자열을 처리하는 방법 중의 하나로 특정한 조건의 문자를 '검색'하거나 '치환'하는 과정을 매우 간편하게 처리 할 수 있도록 하는 수단이다. "정규식"과 "정규표현식"은 같은 말입니다. "정규표현식"을 줄여서 "정규식"이라고 합니다. 영어로는 "Regular Expression (레귤러 익스프레션)"이라고 하는데, 이것이 너무 길기에, Regexp 또는 더 줄여서 Regex 라고 간편히 기술합니다. 즉 정규식이라는 것은 "문자열을 다루는 공식". 수학에 숫자를 다루는 공식이 있듯이, 프로그래밍에서 "ABC" "가나다라" 등의 문자열을 처리할 때 사용하는 것입니다: 참고사이트 정규식 패턴(표현식) 표현식의 다양한 특수기호.. [React] Form 유효성 검사 : Input 글자 수 제한 글자수를 maxLength에 넣을 경우 글자 수가 간단하게 제한 되지만 오류가 생길 수 있다. 아래와 같이 Number 타입에서는 오류가 생길 수 있어서 글자 수를 10으로 제한 두었지만 1개가 더 입력된다. 원인: 한글과 영어의 byte 차이 때문에 일어나는 현상이다. 한글은 2byte 영어는 1byte 로 표현되기 때문이다. 또한 기기마다 작동이 안되는 오류가 발생할 수 있으므로 onInput을 통해 이중 코드를 작성하여 오류를 방지했다. oninput 적용 값이 바뀔 때마다 발생하는 이벤트는 oninput이벤트이다. onInput을 활용해 글자 수를 slice해준다. ... const handleChangeRegex = ( e: React.ChangeEvent /* | React.ChangeEven.. [React] Form 유효성 검사 : RegExp 객체 [JS] RegExp 객체 RegExp 객체 RegExp 객체는 정규 표현식을 구현한 자바스크립트 표준 내장 객체입니다. RegExp 객체를 생성하는 문법은 다음과 같습니다. 문법 new RegExp(검색패턴[, 플래그]); 1. 검색 패턴을 나타내는 정규 표현식은 따옴표나 슬래시(/)로 감싸야 합니다. 2. 기본 검색 설정을 변경할 수 있는 플래그는 필요할 때만 전달할 수 있습니다. RegExp.prototype 메소드 모든 RegExp 인스턴스는 RegExp.prototype으로부터 메소드와 프로퍼티를 상속받습니다. 이렇게 상속받은 RegExp.prototype 메소드를 사용하여 정규 표현식을 표현할 수 있습니다. 1. RegExp.prototype.exec() 2. RegExp.prototype.t.. 이전 1 다음
