문자 검사하는 가장 쉬운 방법
'문자'.includes('찾을단어')
아무 문자 뒤에 .includes() 붙이면
문자에 찾을 단어가 있는지 검사해주고 있으면 ture 없으면 false 남겨줌
하지만 한글 or 영어가 들어있는지, A로 끝나는지, A로 시작하는지, 마침표 다음에 영어가 있는지 등등 이런건 include()만으로 검사하기 힘들다
정규 표현식 (regular expression)
정규식은 문자를 검사하고 싶을 때 사용하는 식
"어떤 문자에 'abc'라는 단어가 들어가있나요?" 라고 물어보고 싶을 때 사용
/abc/-> abc라는 단어가 있나용? 라고 물어볼 준비 완료
/abc/.test('abcdef')-> abcdef 라는 문자에 abc라는 단어가 있는지 검사하기
/정규식/.test(정규식으로 검사해볼 문자)
정규식 문법
/a/.test('abcde') //true 영어나 한글의 경우 그냥 쓰면 글자가 있는지 없는지 물어봄
/[a-d]/.test('aefg') //true
/[가-다]/.test('다라마바') //true[]기호를 사용해서 문자 범위지정 가능
[a-z] : a부터 z까지 아무 문자 하나
/[a-d]/.test('aefg')-> a부터 d까지 아무 문자가 aefg에 있나용?
/[a-zA-Z]/.test('반가워요') //false
/[a-zA-Z]/.test('반가워요a') //true
/[ㄱ-ㅎ가-힣ㅏ-ㅣ]/.test('반가워요') //true[a-zA-Z] 소문자 a부터 z까지 대문자 A부터 Z까지 아무 알파벳 하나 라는 뜻
[ㄱ-ㅎ가-힣ㅏ-ㅣ] 아무 한글 하나
/\S/.test('abcde') //true 백슬래시S는 특수문자까지 포함한 아무문자 1개라는 뜻
/^a/.test('abcde') //true
/e$/.test('abcde') //true ^a 라고 적으면 a로 시작하는지 검사
e$ 라고 적으면 e로 끝나는지 검사
/(e|f)/.test('abcde') //true| 는 or 기호였당
e 혹은 f중 아무거나 한 문자가 있는지
/a+/뒤에오는 글자들도 a와 일치하면 쭉 찾아달라는 뜻
aaaaa를 찾을 때 사용하면댐
/\S+t/-> 모든 문자 여러 개 다음에 t라는 글자가 있는지 검사
ex) aaaat bbt
이메일 정규식 작성해보기
모든 문자에 @ 그리고 . 이라는 특수문자가 와야함
/\S+@\S+\.\S+/
폼 전송 시 이메일 형식 검증하기
<script>
$('form').on('submit',function(e){
var 입력한값 = document.getElementById('email').value;
if ( /\S+@\S+\.\S+/.test(입력한값) ){
alert('이메일형식아님')
e.preventDefault();
}
});
</script>\S는 딱 한 문자를 의미하기 때문에 + 를 붙여줘야한다
\. 이라는 기호는 마침표가 정규식에서 특수한 문법이기 때문에
마침표 문법이 아닌 진짜 마침표를 찾아달라는 의미
오늘의 숙제📒
폼 전송 시 유저가 입력한 비번에 영어 대문자가 적어도 1개 있는지 검사하고 없으면 alert() 띄우기
<script>
$("form").on("submit", function (e) {
var 입력한값 = document.getElementById("inputId").value;
if (/\S+@\S+\.\S+/.test(입력한값) === false) {
alert("아이디가 이메일 형식이 아닙니다.");
e.preventDefault();
}
var 비번 = document.getElementById("inputPw").value;
if (/[A-Z]/.test(비번) == false) {
alert("비밀번호에 대문자를 포함시키세요");
e.preventDefault();
}
});
</script>