■ はじめに

! とか ? とかの動きがややっこしかったのでメモ。

【０】実行環境
【１】？
　１）オプション引数 (optional parameter)
　２）オプショナルチェイニング (Optional chaining) '?.'
　３）三項演算子
　４）Null 合体演算子 (nullish Coalescing) '??'
【２】！
　１）非nullアサーション演算子 (Non-null assertion operator)

【０】実行環境

* ブラウザで実行できる

https://www.typescriptlang.org/play

【１】？

１）オプション引数 (optional parameter)

https://typescriptbook.jp/reference/functions/optional-parameters

* 関数の引数が省略可能である
 => C# のように Nullableを宣言するものではない

サンプル

function sayHello(name?: string) { }

２）オプショナルチェイニング (Optional chaining) '?.'

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Optional_chaining

* 参照が nullish (null または undefined) の場合、
　例外が発生せずに、 undefined を返す。

サンプル

type TypeScriptFunctionArgs = {
  readonly val1: string
  readonly val2: string
}

function deploy(args?: TypeScriptFunctionArgs): void {
  // 「args?.val1」で受ける
  console.log(`Hello world... ${args?.val1}, ${args?.val2}`)
}

// "Hello world... xxx, yyy"
deploy({
  val1: "xxx",
  val2: "yyy"
} as TypeScriptFunctionArgs)

// "Hello world... undefined, undefined"
deploy()

３）三項演算子

* 詳細は、以下の関連記事を参照のこと

https://dk521123.hatenablog.com/entry/2022/03/12/000000
サンプル

// 抜粋
const result = isAws ? 'This is AWS!!' : 'This is not AWS...'

４）Null 合体演算子 (nullish Coalescing) '??'

* 左辺が null または undefined の場合に右の値を返し、それ以外の場合に左の値を返す

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator
構文

const <variable> = <value> ?? <default_value>;

サンプル

const nullValue = null;
const emptyText = ""; // falsy
const someNumber = 42;

const valA = nullValue ?? "default for A";
const valB = emptyText ?? "default for B";
const valC = someNumber ?? 0;

console.log(valA); // "default for A"
console.log(valB); // "" (空文字列は null でも undefined でもないため)
console.log(valC); // 42

【２】！

１）非nullアサーション 演算子 (Non-null assertion operator)

* Optional Paramaterがnon-nullである（null,undefinedではない）
　ということをコンパイラに明示する

サンプル

let name = entity!.name

参考文献

https://dev.classmethod.jp/articles/typescript-assertions/
https://qiita.com/zigenin/items/364264a6cf635b962542
https://qiita.com/ryo2132/items/12981f61db21112cb61c

プログラムの超個人的なメモ

Memo for Programming.

【JS】【TS】記号の演算子～ ? / ?? / ! ～

■ はじめに

目次

【０】実行環境

【１】？

１）オプション引数 (optional parameter)

２）オプショナルチェイニング (Optional chaining) '?.'

３）三項演算子

４）Null 合体演算子 (nullish Coalescing) '??'

【２】！

１）非nullアサーション 演算子 (Non-null assertion operator)

参考文献

関連記事