こんにちは。フロントエンドの現場で長年コードと向き合ってきた私から、これからTypeScriptの世界へ飛び込むあなたへ、どうしても伝えておきたい「一番大切な約束事」があります。
それが、`tsconfig.json` の設定項目の一つ、`strictNullChecks` です。
正直に言います。最初は「なんだか面倒くさそうだな」と思うかもしれません。でも、これを知っているか知らないかで、あなたの書くコードの「安心感」は天と地ほど変わります。一緒に紐解いていきましょう。
—
TypeScriptの「優しい嘘」と「厳しい現実」
TypeScriptは本来、JavaScriptに型という「お守り」を持たせてくれる言語です。ですが、実は初期設定のままだと、TypeScriptは少しだけ「お人好し」すぎてしまうところがあります。
例えば、`null` や `undefined`（何もない状態）を、本来は「文字列が入るはずの場所」にうっかり混ぜ込んでも、見て見ぬふりをしてしまうことがあるのです。
例え話：空っぽのギフトボックス
想像してみてください。あなたは友達に「中身は必ず『ぬいぐるみ』が入っているよ」という箱を渡しました。ところが、中を開けたら「何も入っていない（null）」状態だったら？
受け取った友達は、「ぬいぐるみの手」を探そうとして、空っぽの箱を掴んでしまい、パニックになりますよね。プログラムの世界でも同じです。これが実行時に発生する「TypeError: Cannot read property ‘…’ of null」という悪名高いエラーの正体です。
`strictNullChecks: true` にするということは、「中身が空っぽかもしれないときは、最初から『空かもしれないよ！』と注意書きを貼ることを義務付ける」という、最強の安全装置なんです。
—
実際にコードで見てみよう
まずは、この設定が「オフ」の状態（あるいは初期のゆるい状態）を想像してみてください。
// 設定が厳しくないと、こんな危なっかしいことができてしまいます
function printName(name: string) {
// nameには必ず文字列が入っていると信じている
console.log(name.toUpperCase());
}
// 誰かがうっかり「何もない（null）」を渡してしまった！
printName(null);
// 実行すると…「そんなメソッドないよ！」と画面が真っ白に（クラッシュ！）
これに対して、`strictNullChecks: true` にすると、TypeScriptは即座に赤線を引いて怒ってくれます。
「おいおい、`name` は文字列って約束だろ？ `null` なんて渡されたら、中身を見ようとしたときに壊れちゃうよ！」と。
どうやって解決するの？
「じゃあ、空っぽの可能性があるときはどうすればいいの？」と思いますよね。答えは簡単です。「もし空っぽだったらどうする？」という予備ルートを用意してあげるのです。
// 名前（name）は「文字列」か「何もない（null）」のどちらかかもしれない、という宣言
function printNameSafe(name: string | null) {
// もし中身が空っぽだったら？というチェックを先にする
if (name === null) {
console.log(“名前はまだ登録されていません”);
return; // ここで処理を終わらせる
}
// ここまで来れば、nameは絶対に文字列だと確定するので安心！
console.log(name.toUpperCase());
}
printNameSafe(“Taro”); // “TARO”
printNameSafe(null); // “名前はまだ登録されていません”
このように、`if` 文でチェックを挟むだけで、プログラムは急に賢く、そして壊れにくくなります。
—
なぜこの設定が「伝説のアーキテクト」にも必須なのか
私が開発の現場でプロジェクトを立ち上げるとき、`tsconfig.json` で最初に確認するのは必ず `strictNullChecks` です。
理由はシンプルです。「エラーの半分は、null や undefined の取り扱いに起因するから」です。
- デバッグ時間が激減する: 「なぜか動かない」の原因の多くが、型チェックの段階で事前に防げるようになります。
- コードが「仕様書」になる: 型定義を見ただけで、「ここは空っぽになる可能性があるんだな」と、他のエンジニアが読み取れるようになります。
- 自信を持ってデプロイできる: 夜中に「突然のエラー報告」で叩き起こされる確率が劇的に下がります。これだけで、心身の健康が守られます（笑）。
—
最後に：つまずくのは当たり前です
TypeScriptを始めたばかりの頃、`strictNullChecks` を有効にすると、あちこちでエラーが出て「なんて厳しいんだ！」と絶望したくなるかもしれません。
でも、安心してください。そのエラーは、あなたのコードが壊れるのを事前に防いでくれた「ヒーロー」です。
一つずつ、`if` 文でチェックをしたり、安全な値を代入したりしていく作業は、最初はパズルのように感じるかもしれませんが、慣れればそれが「当たり前の呼吸」になります。
まずは `tsconfig.json` を開いて、`”strictNullChecks”: true` に設定してみてください。あなたのコードは、今日から一気にプロフェッショナルな品質へと進化します。応援していますよ！
コメント