TypeScriptのundefinedとnullの違い

TypeScriptを書いていると必ず出会うundefinedとnull。どちらも「値がない」ことを表しますが、実は微妙に使い分けがあります。

基本的な違い

undefinedは「値が設定されていない」状態を表します。変数を宣言したけど値を代入していない、関数が何も返さない、オブジェクトに存在しないプロパティにアクセスした時など、JavaScriptが自動的に割り当てる値です。

nullは「意図的に値がない」ことを明示する値です。開発者が「ここには何もない」と明示的に示したい時に使います。

実務での使い分け

実際のコードでは、次のような使い分けが一般的です。

• undefined: 初期化されていない、まだ値が設定されていない状態
• null: 「空である」ことを意図的に表現したい時

たとえば、APIから取得したデータで「ユーザーが意図的にプロフィール画像を設定していない」場合はnull、「まだAPIを叩いていないのでデータがない」場合はundefinedといった使い分けができます。

型チェックの注意点

TypeScriptではstrictNullChecksオプションを有効にすると、undefinedとnullを明示的に扱う必要があります。これにより、予期しないエラーを防げます。

どちらも「値がない」ことを表しますが、この違いを理解しておくことで、より意図が明確なコードが書けるようになります。