先生と生徒の会話形式で理解しよう

生徒

「TypeScriptの設定ファイルに`strict`っていう項目があるんですけど、これは何ですか？」

先生

「それはTypeScriptの厳格モードを有効にする設定です。型チェックをより厳しくして、バグを未然に防ぐことができます。」

生徒

「厳しくするとどんなメリットがあるんですか？逆に難しくなりませんか？」

先生

「確かに最初は戸惑うかもしれませんが、慣れるとコードの品質が格段に向上します。それでは、詳しく見ていきましょう！」

1. strictモードとは？TypeScriptの厳格モードの基本

TypeScriptのstrictモード（厳格モード）とは、TypeScriptコンパイラの型チェック機能を最も厳しいレベルに設定するオプションです。設定ファイルであるtsconfig.jsonの中で"strict": trueと記述することで有効になります。

strictモードを有効にすると、実は複数の厳格なチェックオプションがまとめて有効化されます。これは、例えるなら「自動車の安全装置を全部オンにする」ようなものです。シートベルト警告、エアバッグ、衝突防止システムなど、安全機能をすべて有効にすることで、事故のリスクを大幅に減らせるのと同じように、TypeScriptでもバグの発生を未然に防げます。

tsconfig.jsonでの設定方法

プロジェクトのルートディレクトリにあるtsconfig.jsonファイルに以下のように記述します。


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

この一行を追加するだけで、TypeScriptの厳格な型チェックがすべて有効になります。

2. strictモードを有効にする5つの大きなメリット

メリット1：null・undefinedによるエラーを防ぐ

strictモードでは、変数がnullやundefinedになる可能性を厳しくチェックします。これにより、プログラム実行中に「変数が存在しない」というエラーで突然停止することを防げます。


// strictモードがOFFの場合
function getName(user: { name: string }) {
  return user.name.toUpperCase();
}

// userがnullだとエラーになる
getName(null); // 実行時エラー！

// strictモードがONの場合
function getNameSafe(user: { name: string } | null) {
  if (user === null) {
    return "名前なし";
  }
  return user.name.toUpperCase();
}

このように、strictモードではnullチェックを強制されるため、安全なコードを書くことができます。

メリット2：thisの型が明確になる

JavaScriptではthis（自分自身を指すキーワード）の指す対象が状況によって変わるため、混乱しやすいです。strictモードではthisの型を明示的に指定する必要があるため、間違いを防げます。


class Counter {
  count = 0;
  
  increment() {
    this.count++;
  }
  
  // strictモードでは、thisの型を明確にする必要がある
  getIncrementer() {
    return () => {
      this.count++; // アロー関数でthisを正しく参照
    };
  }
}

メリット3：型の不一致を早期発見

strictモードでは、暗黙的な型変換（こっそり型を変えること）を許しません。これにより、開発段階で型の間違いを見つけられます。実行してからエラーになるより、書いている段階で気づけた方が修正が簡単です。


// strictモードでエラーになる例
let age: number;
age = "18"; // エラー：文字列を数値型の変数に代入できない

// 正しい書き方
let age: number;
age = 18; // OK

メリット4：関数の引数チェックが厳格になる

関数に渡す引数の数や型が正しいかどうかを厳密にチェックします。引数の数を間違えたり、型が違うものを渡したりするミスを防げます。


function greet(name: string, age: number) {
  console.log(`こんにちは、${name}さん（${age}歳）`);
}

greet("太郎"); // エラー：引数が足りない
greet("太郎", "20"); // エラー：第2引数は数値型であるべき
greet("太郎", 20); // OK

メリット5：プロパティの初期化を強制

クラスのプロパティ（クラス内の変数）は、必ず初期値を設定するか、コンストラクタ（クラスを作るときに実行される特別な関数）で値を設定する必要があります。これにより、未初期化の変数を使ってしまうミスを防げます。


class User {
  name: string; // エラー：初期化されていない
  age: number = 0; // OK：初期値を設定
  
  constructor(name: string) {
    this.name = name; // OK：コンストラクタで初期化
  }
}

3. strictモード使用時の注意点と対策

注意点1：既存プロジェクトへの導入は慎重に

すでに動いているプロジェクトにstrictモードを適用すると、大量のエラーが発生する可能性があります。これは家の耐震補強工事のようなもので、一度に全部やろうとすると大変です。段階的に導入することをおすすめします。

対策：まずは新しいファイルだけstrictモードで書き始めて、徐々に古いファイルも修正していく方法が効果的です。また、strictモードを構成する個別のオプション（strictNullChecks、strictFunctionTypesなど）を一つずつ有効にしていく方法もあります。

注意点2：外部ライブラリとの相性問題

古いJavaScriptライブラリや、型定義が不完全な外部ライブラリを使う場合、strictモードだとエラーが出ることがあります。これはパズルのピースが合わないような状況です。

対策：型アサーション（型の断言）や型定義ファイルの追加で対応できます。また、特定のファイルだけstrictチェックを無効にする// @ts-nocheckコメントを使う方法もあります。


// 型アサーションの例
const data = JSON.parse('{"name": "太郎"}') as { name: string };

注意点3：初心者には学習コストが高い

strictモードは多くのチェックを行うため、初心者にとっては「なぜエラーになるのか」を理解するのが難しい場合があります。TypeScriptを学び始めたばかりの段階では、エラーメッセージの意味を調べる時間が増えるかもしれません。

対策：まずはstrictモードをOFFにして基本を学び、TypeScriptの型システムに慣れてからstrictモードを有効にするのも一つの方法です。ただし、新規プロジェクトでは最初からstrictモードを有効にすることを強く推奨します。

注意点4：コード量が増える可能性

strictモードでは、nullチェックや型ガード（型を確認する処理）を書く必要があるため、コードの行数が増えることがあります。しかし、これは「安全のための必要なコスト」と考えましょう。


// strictモードOFFなら短く書ける
function getLength(text: string) {
  return text.length;
}

// strictモードONだと安全チェックが必要
function getLengthSafe(text: string | null) {
  if (text === null) {
    return 0;
  }
  return text.length;
}

4. strictモードで有効になる主要なオプション

strictモードを有効にすると、以下のオプションがすべて自動的にONになります。それぞれの役割を理解しておくと、エラーメッセージの意味が分かりやすくなります。

オプション名	説明
`strictNullChecks`	nullとundefinedのチェックを厳格にする
`strictFunctionTypes`	関数の型チェックを厳格にする
`strictBindCallApply`	bind、call、applyメソッドの型チェックを厳格にする
`strictPropertyInitialization`	クラスプロパティの初期化を強制する
`noImplicitAny`	暗黙的なany型を禁止する
`noImplicitThis`	thisの型が不明確な場合にエラーを出す
`alwaysStrict`	JavaScriptのstrict mode（厳格モード）を有効にする