TypeScriptのOptionalChaining

TypeScript3.7からOptional Chainingが使えるようになっていた

Rubyでいうボッチ演算子

?.を挟むことでnullやundefinedの可能性があっても毎度チェックせずともよしなにやってくれる

関数呼び出しも同様に書くことができ次のようなパターンで記述可能

hoge?.fuga
hoge?.[0]
hoge?.(args)

ネストの深いJSONなどで存在チェックをする際に楽に書けるようになる

GAのAPIレスポンスの特定のレコードを取得する

-    if (response && response.data && response.data.reports && response.data.reports[0] && response.data.reports[0].data && response.data.reports[0].data.rows) {
+    if (response?.data?.reports?.[0]?.data?.rows) {
       return response.data.reports[0].data.rows;
     }
     else {
       return [];
     }

Null合体演算子と組み合わせると次のように書くことができ、さらにスッキリする

左辺がnullやundefinedの場合はから配列を返す

return response?.data?.reports?.[0]?.data?.rows ?? [];

参考

Optional chaining - JavaScript | MDN

参考

関連記事

Profile

Account

RSS