0%

008重新認識JS-Day02-筆記1

Falsy 與 Truthy: 論Boolean的型別轉換

以下幾個情況,是經過Boolean()轉型後,會變成false的部分
undefined, null, +0, -0, NaN, 雙引號的空字串”” 或 單引號的空字串’’

除了以上這幾種情況以外,經過Boolean()轉型,其結果皆為true

經過Boolean()轉型結果為false的,我們稱為Falsy值。
經過Boolean()轉型結果為true的,我們稱為Truthy值。

邏輯運算子 && 和 ||

透過&&||所產生的值,不一定是布林值,也有可能是運算子兩端的其中一個值。
&&||在做判斷的時候,會先從左邊來做判斷。

&& 和 || 的比較規則

如果有一端不是布林型別的話要怎麼做判斷呢?

&&的比較規則
若第一個數值經過Boolean()轉換後為true,則回傳第二個值,否則回傳第一個數值。

||的比較規則
若第一個數值經過Boolean()轉換後為true,就直接回傳第一個數值,否則回傳第二個數值。

ex:

1
2
3
4
5
6
7
8
9
10
let a = 123;
let b = "abc";
let c = null;

console.log(a && b); // "abc",因為Boolean(a)是true,所以,並遵照&&規則,回傳第二個數值
console.log(a || b); // 123,因為Boolean(a)是true,並遵照||規則,所以,回傳第一個數值
console.log(b && c); // null,因為Boolean(b)是true,所以,並遵照&&規則,回傳第二個數值
console.log(b || c); // "abc",因為Boolean(b)是true,所以,並遵照||規則,回傳第二個數值
console.log(c && a); // null,因為Boolean(c)是false,所以,並遵照&&規則,回傳第一個數值
console.log(c || a); // 123,因為Boolean(c)是false,所以,並遵照||規則,回傳第二個數值

如果是在if判斷句中用&&或||做比較呢?

ex:

1
2
3
4
5
6
7
8
9
10
11
let a = 123;
let b = "abc";
let c = null;

if(a && b){ // 回傳"abc",接著,再對"abc"做Boolean()轉換,結果為true,所以,會進這個判斷式
/* do something */
}

if(c && a){ // 回傳null,接著,再對null做Boolean()轉換,結果為false,所以,不會進這個判斷式
/* do something */
}

邏輯運算子(Logical Operator)

「NOT!」: 以!表示,原本是true的值,經過!轉換後,會變成false
反之,原本是false的值,經過!轉換後,會變成true

所以,有很多人會利用兩次!!的操作,來取代Boolean(),因為,透過兩次!!的反向操作,
就可以得到原本該值經過布林轉換後的結果。
ex:

1
console.log(!!'false');  // true