TypeScript 3.7以降で使える ?? 演算子。 || 演算子より厳密に undefined や null を判定してくれるので多用していたが、こいつの名前は何だろうと思って調べてみたところ、Nullish Coalescing Operator、日本語だとNull結合演算子というらしい。
ついでに、 ?. で undefined または null な参照の場合に、エラーではなく undefined にしてくれる、RubyでいうところのNull条件演算子は、 Optional Chaining Operatorというらしい。
どちらもECMAScript2020で追加された構文で、主要ブラウザの最新版や、Node.js v14からはJavaScriptでも使えるようになっているのでメモ。
Nullish Coalescing Operator(Null結合演算子)
左辺が null または undefined の場合は右辺、それ以外の場合は左辺を戻り値として返す。
|| (OR演算子)との違いは、OR演算子は左辺が false として判定される場合は右辺が返るのに対し、 ?? では null または undefined に限定されること。
Falsy (偽値) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN
// null, undefinedの場合は、Null結合演算子とOR演算子の違いなし console.log(null || 'NULL'); // NULL console.log(null ?? 'NULL'); // NULL console.log(undefined || 'UNDEFINED'); // UNDEFINED console.log(undefined ?? 'UNDEFINED'); // UNDEFINED // 左辺がfalsyな場合、結果が異なる console.log(false || true); // true console.log(false ?? true); // false console.log(0 || 1); // 1 console.log(0 ?? 1); // 0 console.log('' || '空文字'); // 空文字 console.log('' ?? '空文字'); // (何も表示されない)
Optional Chaining Operator(オプショナルチェイニング演算子)
オブジェクトのプロパティ参照時、 . (ドット表記法、MDNの文中ではチェーン演算子と呼称)を利用すると、オブジェクトが null や undefined の場合は Uncaught TypeError: Cannot read property が発生するが、 ?. を使うと undefined が返る。
プロパティチェーンで利用すると、途中のプロパティのいずれかで undefined が返れば短絡評価されるので、それ以降は実行されない。
ドット表記法だけでなく、ブラケット表記法や配列のインデックスアクセス、関数呼び出しにも使用可能。
const obj = arr = func = undefined; console.log(obj?.prop); // ドット表記法 console.log(obj?.['expr']); // ブラケット表記法 console.log(arr?.[0]); // 配列のインデックスアクセス console.log(func?.('args')); // 関数呼び出し
和名について
2020/8/23時点で、Optional Chaining Operatorの日本語ページでは和訳が「オプショナルチェイニング演算子」と記載されている。
翻訳が進めば「Null条件演算子」になるかな? それとも「オプション連鎖演算子」とかだろうか?
と思っていたら、三項演算子のページからは、「オプション連鎖」でリンクが張られていた。
2022/7/14 追記
結構前からだが、和訳されていた。
Nullish Coalescing Operator は「Null 合体演算子」、Optional Chaining Operator は「オプショナルチェーン (演算子)」となっていた。
振り返り
TypeScriptの Planning ラベルがついたissueに、バージョンごとのTypeScriptでリリースされた機能などがまとまっている。
演算子の中でも、はてな記号、クエスチョンマークがつくと検索に引っ掛かりづらいので困る。
参考
ECMAScript2020で追加された仕様については、以下にまとまっている。
