Nullish coalescing と optional chaining を合わせて使う【JavaScript】

Nullish coalescing と optional chaining の合わせ技を見ていきましょう。

let name = undefined;
if (user.details && user.details.name && user.details.name.firstName) {
    name = user.details.name.firstName;
} else {
    name = "N/A";
}

このコードは下記のとおりリファクタリングできます。

const name = user.details?.name?.firstName ?? "N/A";

ここで起こっていることは、
user.details?.name?.firstName のどこかで存在しないプロパティがあると、即座にundefinedが返ってきますが、その場合は”N/A”がnameに格納されます。
undefinedでは使い勝手が悪く”N/A”という文字列を代わりに使いたい場合に便利です。