ToolNote
💡 Tips

TypeScriptでany型を避ける方法｜unknownや型ガードで安全に書く

by Hiroshi

TypeScript を使っているのに any を多用していては、型の恩恵をほぼ捨てているのと同じだ。この記事では、any を避けて型安全に書く具体的な方法を整理する。結論を先に言うと、「外部から来る不明な値は unknown で受け、型ガードで絞り込む」のが基本パターンになる。

なぜ any が危険なのか

any は「型チェックを無効化する」型だ。any を一度通すと、その先の型エラーが一切検出されなくなる。

const data: any = JSON.parse(input);
data.foo.bar.baz; // 実行時に落ちてもコンパイルは通ってしまう

これでは TypeScript を使う意味が薄れる。any は「型を諦めた印」だと考えよう。

① unknown で受ける

不明な値は any ではなく unknown で受ける。unknown は「使う前に型を確認しろ」と強制してくれる。

const data: unknown = JSON.parse(input);
// data.foo;  // ← これはエラー。先に絞り込みが必要

② 型ガードで絞り込む

unknown を安全に使うには、型ガードで「これは○○型だ」と確定させる。

function isUser(v: unknown): v is { name: string } {
  return typeof v === 'object' && v !== null && 'name' in v;
}

if (isUser(data)) {
  console.log(data.name); // ここでは安全に使える
}

③ ジェネリクスで汎用性を保つ

「何の型か呼び出し側で変わる」ケースは、any ではなくジェネリクスで型を引き回す。

function first<T>(arr: T[]): T | undefined {
  return arr[0];
}
const n = first([1, 2, 3]); // number | undefined と推論される

④ 型アサーションは最小限に

as による型アサーションは「自分が責任を持つ」宣言だ。便利だが乱用は any と同じ危うさがある。本当に型が分かっている箇所だけに留める。

どうしても any を使うときは

外部ライブラリの型が壊れているなど、やむを得ない場合は // eslint-disable-next-line などで意図的だと明示し、範囲を最小化する。「うっかり any」と「意図的 any」を区別できる状態にしておくのが大事だ。

プロを目指す人のためのTypeScript入門　安全なコードの書き方から高度な型の使い方まで Software Design plus
📚 おすすめ書籍

プロを目指す人のためのTypeScript入門　安全なコードの書き方から高度な型の使い方まで Software Design plus

参考価格￥3,212（税込）

TypeScriptを完全習得するための定番書

Amazonで最新価格をチェック

まとめ

  • any は型チェックを無効化する。乱用は TypeScript を使う意味を消す
  • 不明な値は unknown で受け、型ガードで絞り込む
  • 汎用性が要るならジェネリクスで型を引き回す
  • 型アサーション as は最小限に。やむを得ない any は意図を明示する
#TypeScript #型安全 #Web開発