TechBlog

TypeScript実践ガイド:プロジェクトで役立つベストプラクティス

by あくえり
#typescript #javascript #型安全 #ベストプラクティス
目次

TypeScriptの型を最大限活用する

TypeScriptを使う最大のメリットは、コンパイル時に型エラーを検出できることです。しかし、any型を多用してしまうと、そのメリットが失われます。

strict モードを有効にする

tsconfig.jsonstrict: trueを設定しましょう:

{
  "compilerOptions": {
    "strict": true
  }
}

これにより、以下のオプションが一括で有効になります:

  • strictNullChecks
  • strictFunctionTypes
  • strictBindCallApply
  • noImplicitAny
  • noImplicitThis

ユーティリティ型を活用する

TypeScriptには便利なユーティリティ型が多数用意されています:

Partial と Required

interface User {
  name: string;
  email: string;
  age: number;
}

// すべてのプロパティをオプショナルに
type UpdateUser = Partial<User>;

// すべてのプロパティを必須に
type StrictUser = Required<User>;

Pick と Omit

// 特定のプロパティだけを選択
type UserName = Pick<User, 'name' | 'email'>;

// 特定のプロパティを除外
type UserWithoutAge = Omit<User, 'age'>;

型ガードを使う

ランタイムでの型チェックを型システムに伝えるために、型ガードを活用しましょう:

function isString(value: unknown): value is string {
  return typeof value === 'string';
}

function processValue(value: unknown) {
  if (isString(value)) {
    // ここでvalueはstring型として扱える
    console.log(value.toUpperCase());
  }
}

const assertionを活用する

リテラル型を保持したい場合はas constを使います:

const colors = ['red', 'green', 'blue'] as const;
// 型: readonly ['red', 'green', 'blue']

type Color = typeof colors[number];
// 型: 'red' | 'green' | 'blue'

まとめ

TypeScriptの型システムを正しく活用することで、バグの少ない堅牢なコードを書けます。strictモードの有効化、ユーティリティ型の活用、型ガードの使用を心がけましょう。

共有: