TypeScriptの「厳格さ」と仲良くなろう！`strictPropertyInitialization`でバグを未然に防ぐコツ
こんにちは！TypeScriptの世界へようこそ。
新しい技術を学び始めると、コンパイラから「ここがダメですよ！」と真っ赤なエラーを突きつけられて、心が折れそうになることはありませんか？
特にTypeScriptを使い始めると、`tsconfig.json`という設定ファイルの中で「`strictPropertyInitialization`」という、いかにも難しそうな名前の設定に出会うはずです。
「なんでわざわざ厳しくするの？」「動けばいいじゃない！」と思うかもしれません。でも、この設定は実は「未来の自分への最高のプレゼント」なんです。今日は、この設定がなぜ大切なのかを、身近な例え話と一緒に紐解いていきましょう。
—
1. 「空っぽの箱」を渡される恐怖
まずは、想像してみてください。あなたは今、新しいお仕事で「特製のお弁当箱」を配る係だとします。
TypeScriptのクラスというのは、まさにこの「お弁当箱」のようなものです。`strictPropertyInitialization`という設定は、「お弁当箱を配る前に、必ず中身（おかず）が入っているか確認しなさい！」という厳しいルールです。
もし、このルールがなかったらどうなるでしょう？
中身が空っぽのままお弁当箱を渡された人は、お昼休みにフタを開けて「えっ、何も入ってないの！？」とパニックになりますよね。プログラムの世界でも同じです。「中身があるはずだ」と思ってアクセスしたデータが実は空っぽ（`undefined`）だったら、画面は真っ白になり、アプリはクラッシュしてしまいます。
—
2. 実践：エラーが出るコードと修正のポイント
具体的にコードを見てみましょう。例えば、ユーザー情報を扱うクラスを作ったとします。
class User {
// 名前というプロパティを用意したけど、初期値を入れていない状態
name: string;
constructor() {
// ここで名前をセットし忘れると……？
}
}
// 実際にお弁当箱（インスタンス）を作ってみる
const user = new User();
console.log(user.name.length); // うわっ！エラーだ！
`strictPropertyInitialization`がオンになっていると、TypeScriptはコンストラクタの段階でこう叱ってくれます。
「おいおい、`name`っていう箱があるのに、中身を入れないまま配る気か？」と。
どうやって直せばいいの？
解決策は大きく分けて3つあります。あなたの状況に合わせて選んでみてください。
方法A：コンストラクタで必ず値をセットする（一番の推奨！）
一番確実なのは、箱を作るときに必ず中身を入れるルールを守ることです。
class User {
name: string;
constructor(name: string) {
// ちゃんと箱に名前を入れる！これで安心
this.name = name;
}
}
const user = new User(“太郎”);
console.log(user.name); // 無事に「太郎」が表示されます！
方法B：初期値を与えておく
「特別なことがない限り、最初はこれでいいや」という値があるなら、最初から入れておきましょう。
class User {
// 最初から「名無し」という値を入れておく
name: string = “名無し”;
}
方法C：どうしても後で設定したい場合（`!` を使う）
「いやいや、この値は後から外部システムから読み込むから、今は空でもいいんだ！」という特別な事情がある場合もありますよね。そんなときは、`!`（非nullアサーション演算子）を使って、TypeScriptに「ここは大丈夫、後で責任を持って入れるから！」と伝えます。
class User {
// ! をつけることで「今は空だけど許して！」と伝える
name!: string;
}
※ただし、これは最後の手段です。本当に後で入れる保証がないと、結局動いた後にエラーになるので注意してくださいね。
—
3. なぜ「厳しさ」が必要なのか
初学者のうちは、「エラーが出ないように書く」だけで精一杯かもしれません。でも、この設定を有効にしておくと、「プログラムを動かす前に、間違いを教えてくれる」という最強の武器が手に入ります。
もしこのチェックがなかったら、実際にアプリをリリースして、ユーザーさんが使っている時に突然「エラーです！」と止まってしまうかもしれません。そんな悲劇を防ぐための「守り神」が、この`strictPropertyInitialization`なんです。
—
最後に：つまずいても大丈夫
TypeScriptの設定ファイルが真っ赤になっても、それはあなたが悪いわけではありません。TypeScriptがあなたの書いたコードを一生懸命チェックして、「こう書けばもっと安全で頑丈なプログラムになるよ！」とアドバイスを送ってくれているだけなんです。
最初は少し窮屈に感じるかもしれませんが、慣れてくると「あ、ここ初期化忘れてるな」と、コードを書いている最中に気づけるようになります。そうなれば、あなたも立派なTypeScriptエンジニアの仲間入りです。
まずはこの設定を「オン」にしたまま、エラーを一つずつ解決してみてください。大丈夫、必ず書けるようになりますよ。
それでは、素敵なコーディングライフを！
コメント