TypeScriptデータバリデーション入門！安全な型設計とエラーチェックの基本

1. データバリデーションとは？

1. データバリデーションとは？

データバリデーションとは、プログラムに入力されるデータが、あらかじめ決められたルールに沿っているかどうかを確認する作業のことです。日本語では「入力値検証」や「データ妥当性確認」とも呼ばれます。身近な例で例えると、遊園地のアトラクションに乗る前にある「身長制限のチェック」や、劇場の入り口で行われる「チケットの確認」のようなものです。これらと同じように、プログラムの世界でも、不適切なデータが中に入ってこないように入り口で厳しく見張る必要があります。

パソコンのプログラムは、人間が思いもよらないデータを入力したときに、正しく動かなくなったり壊れてしまったりすることがあります。例えば、数値を入力するべき場所に文字が入力されたり、必須の項目が空っぽのまま送信されたりすることです。こうしたトラブルを未然に防ぎ、システムの安全性を高めるために、データバリデーションという仕組みがどうしても必要になります。

2. 型の役割とバリデーションの違い

2. 型の役割とバリデーションの違い

TypeScriptというプログラミング言語には、「型（かた）」という非常に便利な概念があります。型とは、データが「文字」なのか「数値」なのか、あるいは「真偽値（正しいか間違いか）」なのかという種類をあらかじめ指定しておく設計図のようなものです。これによって、プログラムを書いている最中に明らかな間違いを見つけることができます。これを「静的型チェック」と呼びます。

しかし、型チェックだけでは防げない問題があります。それは、プログラムが実際に動いている最中に、外部からやってくるデータです。例えば、インターネット上の画面からユーザーが入力する文字や、別のシステムから送られてくるデータは、プログラムを動かしてみるまで中身がわかりません。型チェックは「これは数値のデータが入る場所ですよ」という枠組みを保証してくれますが、「その数値が1以上100以下であるか」といった具体的な中身のルールまではチェックできません。そのため、型による設計図と、動的なデータバリデーションの両方を組み合わせて使うことが非常に重要になります。

3. 基本的なデータチェックの書き方

3. 基本的なデータチェックの書き方

それでは、まずは最も単純なデータバリデーションの方法を見てみましょう。条件分岐を使って、送られてきたデータが正しいかどうかを調べる方法です。ここでは、ユーザーの年齢が記述されたデータを受け取り、その年齢が正しい範囲にあるかどうかを確認するプログラムを作成します。

let userAge = 25;

if (userAge >= 0 && userAge <= 120) {
    console.log("正しい年齢のデータです。");
} else {
    console.log("エラー：年齢の値が正しくありません。");
}

上記のプログラムでは、「userAge」という箱の中に「25」という数値が入っています。条件文を使って、年齢が「0以上」かつ「120以下」であるかを判定しています。この範囲に収まっている場合は正しいデータとして処理を続け、範囲外の場合はエラーとして処理を中断します。これがバリデーションの最も基礎となる考え方です。

実際の実行結果は以下のようになります。

正しい年齢のデータです。

4. 文字列の長さを検証する方法

4. 文字列の長さを検証する方法

次に、文字の長さをチェックするバリデーションについて学びましょう。ウェブサイトの会員登録などで、パスワードを設定するときに「8文字以上で入力してください」といった注意書きを見たことがあると思います。これも立派なデータバリデーションの一種です。文字の長さを数える仕組みを使って、ルールに違反していないかを調べます。

let inputPassword = "abc";

if (inputPassword.length >= 8) {
    console.log("安全なパスワードです。");
} else {
    console.log("エラー：パスワードは8文字以上で入力してください。");
}

このプログラムでは、「inputPassword」という場所に「abc」という3文字のデータが入っています。「.length」という命令を使うことで、文字の長さを数字として取得することができます。今回は3文字しかないので、8文字以上という条件を満たさず、エラーのメッセージが表示されることになります。

画面への出力結果は次のようになります。

エラー：パスワードは8文字以上で入力してください。

5. オブジェクト形式のデータチェック

5. オブジェクト形式のデータチェック

実際の開発では、名前や年齢、メールアドレスなど、複数のデータが一つにまとまった複雑な構造を扱うことが多くなります。このように、関連するデータをひとまとめにしたものを「オブジェクト」と呼びます。オブジェクトのバリデーションでは、それぞれの項目がすべてルールを守っているかを一つずつ確認していく必要があります。

let userData = {
    userName: "太郎",
    userEmail: ""
};

if (userData.userName === "") {
    console.log("エラー：名前が入力されていません。");
} else if (userData.userEmail === "") {
    console.log("エラー：メールアドレスが入力されていません。");
} else {
    console.log("すべてのデータが正しく入力されています。");
}

この例では、ユーザーのデータの中に「名前」と「メールアドレス」が含まれています。条件文を順番に実行していき、名前が空っぽではないか、メールアドレスが空っぽではないかを厳しくチェックしています。どこか一つでも不備があれば、そこで処理を止めてエラーを知らせる仕組みになっています。このように、複数の項目を網羅して調べることで、データの信頼性が大幅に向上します。

出力結果は以下の通りです。メールアドレスが空なので、エラーが発生しています。

エラー：メールアドレスが入力されていません。

6. 型安全を高める拡張性と設計のコツ

6. 型安全を高める拡張性と設計のコツ

プログラムの規模が大きくなってくると、データの種類やバリデーションのルールもどんどん増えていきます。そのたびに毎回長い条件分岐を書いていると、プログラムが複雑になり、どこに何が書いてあるのか分からなくなってしまいます。そのため、将来の変更や機能の追加にも耐えられるような、「拡張性」のある設計を意識することが大切です。

拡張性を高めるためには、チェックするルールを一つの部品として独立させることがお勧めです。例えば、「文字が空でないか調べる部品」「数値の範囲を調べる部品」をそれぞれ別々に作っておき、それらを必要に応じて組み合わせるようにします。このように設計しておくことで、新しいルールが追加されたときも、既存のプログラムを書き換えることなく、新しい部品を付け足すだけで対応できるようになります。これが、初心者から一歩前進するための重要な設計思想です。

7. バリデーションライブラリという選択肢

7. バリデーションライブラリという選択肢

ここまで学んできたように、自分で一つずつチェックの仕組みを書くこともできますが、世の中にはバリデーションをより簡単に、そして強力に行うための専門の道具が用意されています。これを「バリデーションライブラリ」と呼びます。ライブラリとは、世界中のプログラマーが作った便利なプログラムの詰め合わせのことです。

代表的なものとして「Zod（ゾッド）」というライブラリなどがあります。これらを使うと、「文字であること」「10文字以上であること」「メールアドレスの形式であること」といった複雑な条件を、わずか数行の短いコードでまとめて指定できるようになります。さらに、チェックが成功したと同時に、TypeScriptの型も自動的に作ってくれるという素晴らしい機能を持っています。自分でたくさんの条件文を書く手間が省け、書き間違いによるバグも防ぐことができるため、実際の現場ではこうした道具が多く活用されています。

8. 未経験者が意識すべきエラーハンドリング

8. 未経験者が意識すべきエラーハンドリング

データバリデーションを行う上で、絶対に忘れてはならないのが「エラーハンドリング」です。エラーハンドリングとは、データに間違いが見つかったときに、プログラムを異常終了させることなく、適切に処理を後始末して次の行動へ案内することを言います。ただエラーを見つけるだけでなく、見つけた後にどうするかが重要なのです。

もしエラーハンドリングが適切にできていないと、ユーザーが画面で入力を間違えただけで、システム全体が真っ白になって動かなくなってしまうといった最悪の事態が起こり得ます。不適切なデータを見つけたら、速やかに「入力内容に間違いがあります」という分かりやすいメッセージを画面に表示し、もう一度正しく入力し直せるように誘導するプログラムを心がけましょう。利用者に優しい親切なシステムを作るためにも、バリデーションとエラーハンドリングは必ずセットで考えるようにしてください。