0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

typescriptの強みについて改めて学ぶ

0
Posted at

TypeScriptの強みについて改めて学ぶ

はじめに

普段から当たり前のように TypeScript を書いていますが、いざ「TypeScript の強みって何?」と聞かれると、「型がつくから便利」くらいのふわっとした答えで止まってしまうことはないでしょうか。

毎日触っているツールほど、その良さを言語化する機会は意外と少ないものです。この記事では、TypeScript の強みを 「なぜ嬉しいのか」というメカニズムのレベル まで掘り下げて、改めて整理してみます。

対象読者

  • TypeScript を使ってはいるが、強みを聞かれると説明に詰まる人
  • JavaScript から移ってきて、TypeScript の旨味をもっと引き出したい人
  • チームに TypeScript を導入したいが、説得材料が欲しい人

1. そもそも「型がある」とは何が嬉しいのか

一番の本質は、エラーに気づくタイミングが「実行時」から「記述時」に前倒しされる ことです。

JavaScript では、間違いは実際にコードを動かすまで分かりません。

// JavaScript: 実行して初めて気づく
function getUserName(user) {
  return user.name.toUpperCase();
}

getUserName(null); // 実行時に TypeError: Cannot read properties of null

TypeScript なら、書いた瞬間にエディタが赤線で教えてくれます。

// TypeScript: 書いた瞬間にエラーがわかる
function getUserName(user: { name: string }) {
  return user.name.toUpperCase();
}

getUserName(null);
// コンパイルエラー: Argument of type 'null' is not assignable to parameter of type '{ name: string }'

「バグを見つける」のではなく「バグが入り込む前に弾く」。このフィードバックループの速さこそが、TypeScript の土台となる強みです。

2. 開発体験(DX)を底上げする

型情報は、人間だけでなくエディタも読みます。これが開発体験に直結します。

補完が効く

オブジェクトの型が分かっているので、. を打った瞬間に使えるプロパティやメソッドが候補に出ます。ドキュメントやソースを行ったり来たりする時間が減ります。

リファクタリングが安全になる

プロパティ名やメソッド名を一括リネームしても、型システムが「どこを直すべきか」を漏れなく追跡してくれます。「文字列置換でうっかり関係ない箇所まで書き換えた」という事故が起きにくくなります。

型がドキュメントになる

function sendEmail(to: string, options: { subject: string; cc?: string[] }): Promise<void>;

このシグネチャを見れば、コメントがなくても「何を渡せばよくて、何が返ってくるのか」が分かります。コメントと違って型は嘘をつけない(古くならない)ドキュメントです。

3. 型システムの表現力

TypeScript の型は「ただ string か number かを区別するもの」ではありません。ドメインのルールをコードに落とし込む ための表現力を持っています。

Union 型・リテラル型で「取りうる状態」を縛る

type Status = "pending" | "active" | "archived";

function updateStatus(status: Status) {
  // "activ" のようなタイポは即コンパイルエラー
}

「この値は決まった選択肢のどれかしか取らない」というルールを、型として強制できます。

型の絞り込み(Type Narrowing)

条件分岐の中で、型が自動的に絞り込まれます。

function formatValue(value: string | number) {
  if (typeof value === "string") {
    return value.trim(); // ここでは string として扱える
  }
  return value.toFixed(2); // ここでは number として扱える
}

Generics で「再利用」と「型安全」を両立する

function firstOrNull<T>(items: T[]): T | null {
  return items.length > 0 ? items[0] : null;
}

const num = firstOrNull([1, 2, 3]); // number | null
const str = firstOrNull(["a", "b"]); // string | null

中身の型を問わず使い回せるのに、呼び出し側ではちゃんと具体的な型が返ってくる。この「抽象化しても型情報を失わない」点が Generics の強みです。

Utility Types で「型から型を作る」

既存の型を加工して、新しい型を生み出せます。これは API の入力・出力を定義するときに特に効きます。

interface User {
  id: string;
  name: string;
  email: string;
  createdAt: Date;
}

// 作成時は id と createdAt は不要
type CreateUserInput = Omit<User, "id" | "createdAt">;

// 更新時は一部のフィールドだけ受け取りたい
type UpdateUserInput = Partial<Pick<User, "name" | "email">>;

User という「正」の型を一つ定義しておけば、そこから派生する型はすべて自動で追従します。元の型にフィールドを追加すれば、関連する型にも反映される。型の単一責任 とも言える設計ができます。

as const で値をそのまま型にする

const config = {
  retryCount: 3,
  mode: "production",
} as const;

// config.mode の型は string ではなく "production"

4. チーム・大規模開発で本領を発揮する

型は、モジュール間・人間同士の 「契約」 として機能します。

ある関数が CreateUserInput を受け取ると宣言した時点で、呼び出す側はその形に従う義務が生まれます。実装の中身を知らなくても、型さえ合っていれば安全に呼び出せる。これは、複数人で開発するときの「認識のズレ」を型レベルで防いでくれるということです。

特に効いてくる場面が以下です。

  • 大規模リファクタリング: 型を変えれば、影響範囲がコンパイルエラーとして全部洗い出される。「とりあえず動かして確認」ではなく、機械的に修正漏れを潰せる。
  • API の境界: リクエスト/レスポンスの形を型(DTO など)で定義しておけば、フロントとバックの間で食い違いが起きにくくなる。
  • 新しくジョインした人の理解: 型を追えば、どんなデータがどう流れるのかを把握しやすい。

コードベースが大きくなるほど、そして関わる人が増えるほど、TypeScript の恩恵は加速度的に大きくなります。

5. JavaScript と地続きであること

TypeScript は JavaScript の スーパーセット です。これは地味ですが重要な強みです。

  • 既存の JavaScript 資産をそのまま活かせる
  • 一度に完璧な型をつけなくても、ファイル単位・段階的に導入できる
  • strict オプションなどで、チームの習熟度に合わせて型の厳しさを調整できる

「全部を型で固めないと始められない」のではなく、今あるコードから少しずつ安全にしていける。導入のハードルが低いことも、ここまで普及した理由の一つです。

まとめ

改めて整理すると、TypeScript の強みは大きく次のように言えます。

  • エラー検出の前倒し: 実行時ではなく記述時にバグを弾く
  • 開発体験の向上: 補完・安全なリファクタリング・嘘をつかないドキュメント
  • 型システムの表現力: ドメインのルールをコードに落とし込める
  • チーム開発での安心感: 型が「契約」として認識のズレを防ぐ
  • 段階的に導入できる: JavaScript と地続きで、低リスクで始められる

「型がつくから便利」の一言の裏には、これだけの理由が積み重なっています。普段なんとなく享受している恩恵を一度言語化しておくと、新しい機能を学ぶときの軸にもなりますし、チームへの導入を提案する場面でも武器になります。

ここまで読んでいただき、ありがとうございました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?