こんにちは!
今年も夏が来ましたね〜
エンジニアのみなさま、この時期、夏バテにお気をつけてください...!
中には自宅でエアコンなしの部屋でコーディングされている方もいるんだとか。。。(ただでさえ暑いのに、Macとかめちゃくちゃ熱こもりますし、心配です。。)
今回は「オブジェクトが未定義だった場合のエラーを回避する方法」について、調べてみました。
ご指摘やアドバイス等をいただけると、大変助かります。
【2020年7月4日追記】
@standard-software さんコメントありがとうございます!
オプショナルチェイニングoptional chaining演算子を使います!
[公式ドキュメント] (https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Optional_chaining)
本記事の対象者
JavaScript初心者〜初中級者
(おさらい)
基本パターン
const obj = {name: 'KumKum'};
console.log(obj.name) // KumKum
基本的なオブジェクトの定義ですね
指定したオブジェクトの中身がnullの場合
const obj = null;
console.log(obj.name) // Uncaught TypeError: Cannot read property 'name' of null
オブジェクトがnullの場合エラーになります
指定したオブジェクトの中身がundefinedの場合
const obj = undefined;
console.log(obj.name) // Cannot read property 'name' of undefined
undefinedの場合も同様ですね
ここから本題
先ほどのエラーを回避するにはどうしたら良いのか。
以下のように?(クエッション)
を使うことで、undefined
をセットすることができます。
指定したオブジェクトの中身がnullの場合
const obj = null;
console.log(obj?.name) // undefined
エラーにならず、undefined
が設定されます。
指定したオブジェクトの中身がundefinedの場合
const obj = undefined;
console.log(obj?.name) // undefined
nullと同様、エラーにはなりません。
まとめ
オブジェクト名?.プロパティ名
と指定すると、
オブジェクトがnull
またはundefined
だった場合に、
エラーにならず、undefined
を返す