5月7日（月）に開催されたHead First JavaScript読書会 06に参加しました。
GW明けの月曜日というハードな日程でしたが、無事、乗り切ることができました。
今回はFormのバリデーションと正規表現についてです。
Formのバリデーション
Formとは何ぞや？というところから、httpリクエストの話、httpメソッドの種類(GET, POST, PUT, DELETE, OPTIONなど)について一通りざくっとおさらいしました。
その後、Formデータの取得の仕方、バリデーションが大事な理由などについて話しました。
バリデーションの意義について、313ページには「本当に検討なアプリケーションになるとサーバー上でもデータ検証を行います」と書いてあるけれど、安全のためにはむしろサーバーサイドでデータ検証を行うべきだよなあという話をしました。
何度もサーバーとやり取りをするのもイライラするからちょっとした入力ミスを防ぐことができるよう、Javascriptの制御を入れておく、本当のデータチェックはサーバーサイドでやる、のが良い形なんじゃないだろうか。
安全のためのチェックはサーバー上で行い、クライアントサイドのバリデーションはユーザービリティ向上のために行う、というように目的を分けるという観点はとてもしっくりきました。
正規表現
本書では
- 必須チェックをしたい
- 桁数チェックもしたい
- 数字以外は入力してほしくない
- メールアドレスの形式じゃないものは受け付けたくない
というように、バリデーションのケースがだんだん複雑になってきたところで、正規表現が登場しました。
（よりによって、メールアドレスの正規表現を例に出さなくてもという話はちょっとでましたが）
Javascriptの正規表現は//で囲んで書きます。
"Hello World".match(/^\w{5}\s\w{5}$/)
---
[ 'Hello World', //マッチした
index: 0,
input: 'Hello World' ]
"Hello World".match(/^\w{7}\s\d{5}$/)
---
null // マッチしない場合はnullが返る
グルーピングは()で行うことができます
"Hello World".match(/^(\w{5})\s(\w{5})$/)
---
[ 'Hello World', // マッチした文字列
'Hello', // グループ1番目
'World', // グループ2番目
index: 0,
input: 'Hello World' ]
match関数ではなくRegExpオブジェクトを生成することもできます。
本書では自動的に生成されたRegExpオブジェクトを使う方法が載っていました。
var regex = /^\d{5}/
regex.test("12345")
正規表現はとても便利で、ある程度はできるようになっておきたいし、読めるようにしておきたい。
便利さを感じるようになってから読んだり書いたりを積極的にするようになった。
（正規表現使うたびにgoogleで量化子やメタ文字のリファレンスを探しているので、まだまだですが）
だけど、使いすぎると自分自身も後からメンテナンスが辛くなってくることがあるから、どこまで厳密にチェックするかも含めてさじ加減が大事かもしれないなぁ。