정규표현식 (regular expression)
abcdef라는 문자에 abc라는 단어가 있는지 검사해보도록 합시다.
/abc/.test('abcdef')
/정규식/.test(정규식으로 검사해볼문자) 쓰면 됩니다.
진짜 들어있으면 true를 남기고 없으면 false를 남겨줍니다.
/[a-d]/.test('aefg') //true
/[가-다]/.test('다라마바') //true[ ] 기호를 이용해서 문자 범위를 지정할 수 있습니다.
[a-z] 는 a부터 z까지 아무문자 하나를 의미합니다.
/[a-d]/.test('aefg')
▲ 그래서 이건 a부터 d까지의 아무 문자하나가 저기 있냐라고 검사하는 겁니다.
/[a-zA-Z]/.test('반가워요') //false
/[a-zA-Z]/.test('반가워요a') //true
/[ㄱ-ㅎ가-힣ㅏ-ㅣ]/.test('반가워요') //true[a-zA-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와 일치하면 반복해서 쭉 찾아달라는 뜻입니다.
왜냐면 /a/는 a를 다 찾으라는게 아니라 a 한개를 찾으라는 뜻입니다.
aaaaa 이런걸 찾고 싶으면 /a+/ 쓰면 됩니다.
/\S+t/
이건 그럼 뭘까요.
-> 모든 문자 여러개 다음에 t라는 글자가 있냐를 검사해주는 정규식입니다.
aaaaat
bbt
이런 것들을 잘 찾아주겠군요.
간단히 작성해보는 이메일 정규식
이메일은 어쩌구@어쩌구.어쩌구 이렇게 되어야합니다.
모든 문자 사이에 @ 그리고 .이라는 특수문자가 와야합니다.
/\S+@\S+\.\S+/
이렇게 쓰면 되겠습니다.
\. 이라는 기호는 왜 이렇게 썼냐면 마침표는 정규식에서 특수한 문법이기 때문에
마침표 문법을 쓰는게 아니라 진짜 마침표를 찾아달라라는 의미로 쓰려면 백슬래시를 앞에 붙여야합니다.
그럼 폼전송시 이메일 형식 검증은 어떻게 할까요
$('form').on('submit',function(e){
var 입력한값 = document.getElementById('email').value;
if ( /\S+@\S+\.\S+/.test(입력한값) ){
alert('이메일형식아님')
e.preventDefault();
}
});-
form 전송시
-
유저가
<input>에 입력한걸 찾아서 -
정규식으로 이메일 테스트했을 때 false가 나오면
-
폼 전송을 막거나 alert() 를 띄우거나 하면 됩니다.
폼 전송시 유저가 입력한 비번에 영어 대문자가 적어도 1개 있는지 검사
var 비번 = document.getElementById('pw').value;
if ( /[A-Z]/.test(비번) == false ){
alert('대문자없는데요')
}
});-
패스워드
<input>엔 id="pw" 이런거 부여해서 일단 셀렉터로 입력값을 찾습니다. -
/[A-Z]/.test(비번) 이걸 해서 false가 남으면 alert 띄우라고 코드짰습니다.
이제 전송버튼 누르면 대문자 있는지 검사해줍니다.
