JavaScriptやTypeScriptで検索しづらい演算子

単語ではないものはネットで検索しづらい。「!」や「?.」などだ。
以前記事にしたようなしてないような・・・忘れたので調べ直す。

 

?.

これは TypeScript ではなく JavaScript にある演算子である。
オプショナルチェーンと呼ぶそうだが、英語では optional chaining だ。

オプショナルチェーン演算子
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Optional_chaining

ドットまで含めての演算子になっている。ちなみに「.」は chaining operator と呼ぶそうだ。

リンク先では「adventurer」のプロパティに「dog」がないので「adventurer.dog?.name」となっている。
if文にするならこんな感じにして dog の有無を確認するだろう。

if (adventurer.dog) {
  console.log(adventurer.dog.name)
}

チェックをして dog の時点で undefined とわかっているためか「adventurer.dog?.name.hello」でも「adventurer.dog?.name.hello.world」でも、それから先の chaining operator でつないだ部分は気にしないようだ。

次の行の「adventurer.someNonExistentMethod?.()」はメソッドの有無をチェックしている。
こんな感じで定義をしてやれば呼び出される。

const adventurer = {
  ...
  someNonExistentMethod: () => 'hello',
};

まあ、メソッドの有無は大きい問題になりそうだから、通常は if でチェックするんじゃないかな。

 

 

!

これはおそらく TypeScript の演算子だろう。
Non-null assertion operator と呼ばれる。

Non-null assertion operator
https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-0.html#non-null-assertion-operator

これは「なくてもいいですよ」変数の「?」と逆のような意味といってよいかもしれん。

たぶん「なくてもいいですよ」の「?」も TypeScript だと思うが、これは演算子ではなく型定義でしか使えないはずだ。
option parameter と呼ぶそうであるが TypeScript のドキュメントからは見つけられなかった。

 

とはいえ、何に使えるのか。null じゃないですよ、といいつつも実装上 null になることがありうるのをチェックするようになる？ でもチェックして何ができるというのか。例外を出して終わらせるのであれば「!」がなくても同じだろう。

こちらによると、コンパイラに明示するのが目的らしい。

TypeScriptでよく見る「？」「！」と仲良くしたい
https://zenn.dev/oreo2990/articles/3d780560c5e552

たしかに、「?」にした変数だったりするとわざわざ if 文で「== null だったら処理を続けない」みたいなのを書かないとエラーになっていた気がするので、そういうのを書かなくてよいのかもしれない。
が、それだったらむしろ if 文にしておかないと危ないのでは？ ちょっとテストコードを書くときに、そこで落ちてもいいからコンパイラは無視してくれってことだったらありなのかな。

 

その次に載っていた「明確な割り当てアサーション」は「?」の逆だ。
私はこのオプションを知らなかったが、これも「!」演算子と似たような感じだろう。
確かに書いていてエラーになるのだが、私は初期値を適当に突っ込んでるな。初期値を突っ込むことでロジックが間違っていることには気付きにくくなるかもしれないので、そういうのの洗い出しにはよいかもしれん。