TypeScriptの型定義で学んだこと

TypeScriptを使い始めたばかりの頃、私は「型を付ければ安全になる」くらいのざっくりした理解しかありませんでした。

でも実際に開発を進めると、型の設計の仕方がコードの読みやすさ・変更しやすさに直結していることに気づきました。

この記事では、TypeScript初心者だった自分が「まず知っておけばよかった」と思った 型定義の基本と、実務で役立つ 実践テクニックをまとめます。

型は「エラーを出すため」だけではなく、

データの形（仕様）をコードに明文化するためのものだと理解してから、型の書き方が変わりました。

例えば、ブログ記事のデータがあるとして、

• 必ずあるもの：id, title, content
• ある時とない時があるもの：description
• 配列で持つもの：tags

こういう仕様をそのまま型に落とすと、読み手が迷いにくくなります。

export type Blog = {
  id: string;
  title: string;
  content: string;
  description?: string; // 任意（あるときだけ）
  tags: { id: string; name: string }[];
};

? をつけるだけで「なくてもいい」が表現できるのは、最初かなり助けられました。

TypeScriptを始めた頃は、エラーが出ると any で逃げたくなります。

const data: any = fetchSomething();

ただ、any を使うと型チェックが効かなくなり、

結局「TypeScriptを使っている意味」が薄くなっていきます。

逃げたくなった時は、まず unknown を使うのが安全でした。

const data: unknown = fetchSomething();
// そのままでは触れないので、型を絞ってから使う

「わからないなら unknown、わかるようにしてから使う」という姿勢が、後々の事故を減らしてくれました。

型定義は、コピペで増やすより 共通化 した方が変更に強いです。

例えばタグの型がすでにあるなら、ブログ側でもそれを使うのが自然です。

export type Tag = {
  id: string;
  name: string;
  slug: string;
  description?: string;
};

でも「Blogの中では id/name/slug だけでいい」という場面もあります。

そのとき便利なのが Pick です。

export type Blog = {
  id: string;
  title: string;
  tags: Pick<Tag, "id" | "name" | "slug">[];
};

これで、Tag型の仕様が変わっても、必要な部分だけ追従できます。

TypeScriptの型定義で学んだのは、型は単なるチェック機能ではなく、設計そのものだということでした。

• 型は「仕様を文章にする」感覚で書く
• any に逃げず、unknown から安全に絞る
• 型は再利用して強くする（Pick / Omit など）
• 型エラーは実装のズレを教えてくれる

これからも、機能を作りながら「型を育てる」意識で改善していきたいと思います。