JavaScript 快速空判斷

在 JavaScript 中取得資料時，在使用前可能會需要先檢查資料的正確性，避免發生例外。

假設要將 count 這個變數 +1，但是這個變數可能是從 API 或是其他方式取得，則可能會發生下面的情況：

    
    let count; // todo: 透過 API 取得 count;

    count += 1;
    console.log('count:', count); // count: NaN
    

上面的例子是輸出 NaN，但是在 JavaScript 中可能會出現 null, NaN, undefined 等多種情況，每個變數都全部判斷完需要很長的程式碼，非常不簡潔，通常就是寫個 function，檢查所有情況並設定預設值。 但其實有個容易被忽略的小技巧，就是使用否定運算子。

只要是 null, NaN, undefined, 0, false, 空字串，都會回傳 true:

    
let n = [null, NaN, undefined, 0, "", '', ``, false];
n.forEach((item, index) => {
    console.log(item, !item);
});

/*
null true
NaN true
undefined true
0 true
"" true
'' true
`` true
false true
     */
    

以下會回傳 false:

    
let t = [1, 'a', "b", true, {}, [], function () {}];
t.forEach((item, index) => {
    console.log(item, !item);
});

/*
1 false
a false
b false
true false
{} false
[] false
function () {} false
 */
    

利用這個驚嘆號，我們在處理時可以先判斷資料是否有問題，有問題就設定初始值:

    
    let count; // todo: 透過 API 取得 count;

    count = !count ? 0 : count; // 檢查並設定初始值
    count += 1;
    console.log('count:', count); // count: 1
    

不過其實否定句沒有那麼直覺，所以我們可以在前面再加上一個驚嘆號，在否定運算子判斷完成後將結果相反，true => false, false => true，所以在三元運算子的第一個是變數正常時使用原本的值，第二個則是變數有問題時使用初始值

    
    let count; // todo: 透過 API 取得 count;

    count = !!count ? count : 0; // 檢查並設定初始值
    count += 1;
    console.log('count:', count); // count: 1
    

只要知道這樣使用兩個驚嘆號的小技巧，在操作變數前進行檢查就變得非常的方便！

參考資料：
mdn - Logical NOT (!)