回答。

オプショナルチェイニングメカニズム（?.）は、JavaScriptで導入され、存在しない可能性のあるオブジェクトのプロパティやメソッドに安全にアクセスするための便利な方法です。TypeScriptにおいて特に役立ち、undefinedやnullに対するプロパティやメソッドへのアクセスに関連する実行時エラーを回避するのに役立ちます。

問題の背景

オプショナルチェイニングの導入以前は、開発者はオブジェクトの各ネストレベルの存在を手動で確認する必要があり、それがコードを冗長で可読性が低くしていました：

if (obj && obj.a && obj.a.b) {
  // ...
}

問題

未定義のオブジェクトのネストされたプロパティにアクセスすると、実行時エラーが発生する可能性があります：「Cannot read property 'x' of undefined」です。さらに、長い検証チェーンはコードの保守性と可読性を低下させます。

解決策

オプショナルチェイニング（?.）を使用すれば、nullまたはundefinedである場合、自動的にundefinedを返すことで、ネストされたプロパティ、メソッド、配列の要素にアクセスできます。

コードの例：

interface User {
  name: string;
  address?: {
    city?: string;
  };
}

const user: User = { name: 'Ivan' };
console.log(user.address?.city); // undefined

主な特徴：

短く、安全で、理解しやすいコードを書くことができる。
プロパティ、メソッド、配列のインデックスへのアクセスに機能する。
戻り値の型はT | undefinedであり、TypeScriptコンパイラが考慮し、エラーを回避します。

引っかけ質問。

オプショナルチェイニングは代入演算子の左側で使用できますか？例えば、user.address?.city = 'Moscow'のように。

いいえ、オプショナルチェイニングは代入表現の左側では使用できません。これはコンパイルエラーを引き起こします。オプショナルチェイニングは、読み取りの際にのみ機能します。

オブジェクトが未定義である可能性がある場合に、メソッドを呼び出すためにオプショナルチェイニングを利用できますか？例えば、user?.logInfo()のように。

はい、メソッド呼び出しの前のオブジェクトがundefinedまたはnullである場合、user?.logInfo()の呼び出しはエラーをスローせず、もしuserが未定義であれば単にundefinedを返します。

user?.logInfo(); // userが定義されていればlogInfoが呼び出され、さもなくば何も起こりません

オプショナルチェイニングと従来の&&演算子の違いは何ですか？例えば、user && user.address && user.address.cityのように。

オプショナルチェイニングは短く、すべてのタイプ（メソッドおよび配列を含む）に対応しており、またTypeScriptはそれを型チェックに考慮します。重要なのは、&&演算子を使用すると、誤ってtrue/falseまたはundefinedではなく、ネストされた値を取得する可能性があることです。オプショナルチェイニングは保証済みで、期待される型かundefinedを返します。

一般的な誤りとアンチパターン

オプショナルチェイニングが代入時にネストされたオブジェクトを「作成する」と期待すること — これは誤りです。
型的にundefined/nullになることが絶対にない変数にオプショナルチェイニングを使用すること（不要で無駄なコード）。
オプショナルチェイニングを無分別に使用する習慣があること — これにより、後のコードの保守が困難になります。

実生活の例

ネガティブケース

コードが長いオプショナルチェイニングチェーンを使用し、ビジネスロジックでは変数が常に定義されているケースでさえ使用される。

order?.customer?.address?.city = 'London';

利点：

プロパティが未定義である可能性がある場合にエラーから保護します。

欠点：

どれか一つのプロパティが欠けていると代入は行われなく、エラー通知や処理がないため、「隠れた」論理が生まれ、コードが混乱します。

ポジティブケース

外部データに対処する場合や、値が実際に未定義である可能性がある場所でのみオプショナルチェイニングを使用します：

const city = apiResponse?.info?.location?.city || 'Unknown';