存在が未確定のプロパティのnullやundefinedのチェック
オブジェクトのプロパティが存在するかどうかわからない場合、存在しなかった場合には、そのプロパティを参照しないようにするために、nullまたはundefinedのチェックが必要となります。
チェックをしなかった場合は、そのプロパティが存在しなかった場合に、エラーになります。
エラーを起こさないようにする場合、変数やプロパティがnullまたはundefinedかどうかのチェックをして、存在しなかったときは、undefinedを返す必要があります。普通に書くと下記のような記述になります。ネストが深くなると、もっと記述量が増えて、複雑になります。
const response = { token: "fafae92rfjafa03", ok: true, code: 200 }
const token = response === null || response === undefined ? undefined : response.token;オプショナルチェーンの使い方
オプショナルチェーン(?.)演算子を使うと、上記と同じことを、より簡単に記述することができます。ネストされたプロパティにも使用できます。
const response = { token: "fafae92rfjafa03", ok: true, code: 200 }
const token = response?.token;もしも、?.の前に書かれている変数やプロパティの値が、nullかundefinedだったら、その先の.tokenは評価されずに、undefinedが返ります。上記のコードの場合は、response.tokenまで到達しなくなります。
おわりに
今回は、ネストされたプロパティのnullやundefinedのチェックすることができるオプショナルチェーンについて、まとめました。とても便利なので、ぜひ使ってみてください。
