JavaScriptのtest関数と正規表現でバリデーションチェックを行う
最近JavaScriptでバリデーションをチェックを行ったのですが、今後も使いそうなので、よく使いそうなバリデーションチェックをまとめておきます。
test関数
test関数の使い方は簡単で、下記の形式でチェックするテキストを引数として渡してあげると、合致する場合はtrue、しない場合はfalseを返してくれます。
正規表現.test(チェックするテキスト)引数として渡すのは、正規表現ではなくチェックするテキストなので、逆にしないように注意が必要です。
実際に使うときには正規表現とチェックするテキストは変数にして下記のようにします。
// 正規表現
let regex = /^\d*$/;
// チェックするテキスト
let str = 'sample';
// マッチしたときに処理を走らせる
if( regex.test(str) ){
console.log('チェックする文字列と正規表現が一致');
}!をつけて、マッチしないときにreturn falseで処理を終わらせるという使い方も多そうです。
if( !regex.test(str) ){
return false
}バリデーションチェックでよく使いそうな正規表現
バリデーションチェックでよく使いそうな正規表現をいくつかまとめました。
スニペットツールなどで保存して、すぐペーストできるようにしておくと便利です。
メールアドレス
メールアドレスのexample@example.comの形式かどうかチェックしたい場合は、下記の正規表現を使います。
let regex = /^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]{1,}\.[A-Za-z0-9]{1,}$/;数字のみ
数字のみをチェックしたい場合は、下記の正規表現を使います。
let regex = /^\d*$/;電話番号
「000-0000-0000」のように、3桁・4桁・4桁のハイフン区切りの数字をチェックしたい場合は下記の正規表現を使います。
数字の桁数を変えたい場合は{}内の数字を変えて、ハイフンを変えたい場合は正規表現内の「-」を別の文字にすればOKです。
let regex = /^\d{3}-\d{4}-\d{4}$/;半角英数字のみ
パスワードなどで半角英数字のみのチェックをしたい場合は、下記の正規表現を使います。
let regex = /^[0-9a-zA-Z]*$/
