TypeScriptのNull合体演算子を勉強したのでアウトプットします。
nullまたはundefinedを回避する方法
例えばデータベースなどから返ってくる値(何が返ってくるかわからない値)がnullまたはundefinedだった場合に特定の値を設定したいという場合があります。このような場合Null合体演算子を使用します。Null合体演算子の書き方は「〜 ?? デフォルト値」と書きます。
Null合体演算子で判定結果をみる
では、Null合体演算子を使用して ‘ ‘(空文字)、null、undefinedの場合の判定結果を見てみます。
//空文字の場合
const input = '';
const keepData = input ?? '入力がありません'
console.log(keepData); //（空文字）
//nullの場合
const input2 = null;
const keepData2 = input2 ?? 'input2はnullでした'
console.log(keepData2); //input2はnullでした
//undefinedの場合
const input3 = undefined;
const keepData3 = input3 ?? 'input3はundefinedでした'
console.log(keepData3); //input3はundefinedでした上記のようにnullまたはundefinedだった場合、デフォルト値である ?? の後ろの値が設定される結果となりました。
Null合体演算子を使用すればnullまたはundefinedだった場合、特定の値を設定することでnullやundefinedを回避することができます。
「”(空文字)」も回避したい場合
nullまたはundefinedだけでなく「”(空文字)」も回避したい場合は論理or演算子を使用します。
//空文字の場合
const input = '';
const keepData = input || '空文字です'
console.log(keepData); //空文字です
//nullの場合
const input2 = null;
const keepData2 = input2 || 'input2はnullでした'
console.log(keepData2); //input2はnullでした
//undefinedの場合
const input3 = undefined;
const keepData3 = input3 || 'input3はundefinedでした'
console.log(keepData3); //input3はundefinedでした上記のような結果となりました。
Null合体演算子と論理or演算子を上手に使っていきたいものです。
