[JavaScriptWeird]No.18 存在與布林

發表於 | 更新於 | 分類於

前言

我們了解 JavaScript 是動態型別以及具有強制型轉的特性，也知道強制型轉的缺點，所以我們也必須了解其優點，關於存在 (Exeistence) 與布林 Boolean)

使用 Boolean() 內建函式觀察轉換結果

同於 Number() 可以進行強制轉型為數值型別，Boolean() 則是轉為布林型別。

1
2
3
console.log(Boolean(undefined)); // false  
console.log(Boolean(null)); // false  
console.log(Boolean('')); // false

透過例子我們可以理解， JavaScript 會把 undefined、 null、空字串強制型轉為布林後的值為 false。

那麼該如何利用這個特性?

1
2
3
4
5
var a;  
// 取得一些值給 a  
if (a) {  
  console.log('show something');  
}

如果我們把變數 a 放到 if 陳述句內，則 a 會被轉換成布林值。還記得變數在執行環境的創造階段會發生什麼事嗎?變數會被賦予預設值 undefined ，所以在強制型轉後布林值為 false，所以這個例子輸出的結果是什麼都沒有。

我們回過來看一開始的例子，當 a 的值是 undefined 、 null 、空字串時，這個 if 陳述句會不成立，因為 a 是不存在的、是 false 的。

如果我們給 a 其他值

1
2
3
4
5
6
7
var a;  
// 取得一些值給 a  
a = 'hi';  
if (a) {  
  console.log('show something');   
}  
// show something

這時會因為 a 不是空字串，所以是存在的，輸出結果就如同我們預期。

換言之，我們可以利用強制型轉來檢查變數有沒有值

然而，有個危險的地方要特別注意：

1
console.log(Boolean(0)); // false

數字 0 轉換成布林值也是 false ，我們再將這個狀況帶入剛剛的例子。

1
2
3
4
5
6
var a;  
// 取得一些值給 a  
a = 0;  
if (a) {  
  console.log('show something');   
}

如果最後變數的值為數值 0 ，那麼這個 if 陳述句就有問題，並不如我們預期了，因為 0 並不是不存在，但 a 卻被強制轉型為 false ，因此我們需要稍作修改，可以運用「運算子的優先性」。

1
2
3
4
5
6
var a;  
// 取得一些值給 a  
a = 0;  
if (a || a === 0) {  
  console.log('show something');   
}

可以透過優先性與相依性表格得知，「===」的優先性高於「||」，所以「===」會優先執行，以這個例子來說會得到 true 的結果。

整理一下，目前情況是這樣：

1
2
3
if (false || true) {  
  console.log('show something');   
}

讀作「如果 false 或 true 」的話，回傳 true，在這個函式中其中一個值是 true 或都是 true 的話，就會回傳 true 。

最終成為這樣

1
2
3
if (true) {  
  console.log('show something');   
}

印出「show something」

不過如果我們可以確保變數不是數值 0 的話，只需要寫 if (a) 看看存不存在就可以了。如果我們能夠確實地掌握這些觀念，就不會常常因為 if 陳述式跑出非預期的結果而感到困惑了。

0%