JavaScript中的邏輯運算子詳解!
今天我們來總結一下Js中的三種邏輯運算子:與 && 或 || 非 !
- &&操作符 (全真為真,有假則假)。
"與" 翻譯過來就是並且的意思,只有當條件1到條件n都滿足,結果才成立。
在JS中的&&又叫做 “短路與”,
意思就是在判斷第一個表示式為fasle之後,就不必對後面的表示式進行判斷了,因為但凡有false,結果肯定是false。
邏輯與可以操作任意資料型別的資料(這是JS與其他一些程式語言不一樣的地方)
根據&&兩端表示式的資料型別不同,可分為以下兩種:
- 對於運算元為boolean型別的資料
1. true&&true ===>true;
2. true&&false===>false;
3. false&&true===>false;
4. false&&false ===>false.
1.從運算結果可以看出,運算元為boolean型別的資料,結果返回都是Boolean
2.上述例2和例3,計算結果雖然相同,但因為是“短路”操作,執行效率是不一樣的。
- 對於運算元為非boolean型別的資料
先將其進行隱式型別轉換,在進行判斷,最終返回原值。
舉幾個例項說明一下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>邏輯運算子</title> <script type="text/javascript"> //當運算元為兩個時, console.log(5&&4+"\n"); // 5隱式轉換之後為true,返回4 console.log(4&&5+"\n"); // 4隱式轉換之後為true,返回5 console.log(""&&5+"\n"); //空字串轉換之後為false,返回"" console.log(null&&5+"\n"); //操作符中存在null,結果就為null console.log(4&&undefined+"\n"); //操作符中存在undefined,結果就為null console.log(NaN&&5+"\n"); //操作符中存在NaN,結果就為null //當運算元為3個及以上時, console.log(5&&4&&6+"\n"); //結果為真時,返回最後一個數的原值 6 </script> </head> <body> </body> </html>
當運算元為非Boolean型別的時候,&&運算子依舊遵循“短路”運演算法則:
以兩個運算元為例: (表示式1&&表示式2)
1.如果第一個運算元隱式轉換為Boolean之後為true,則返回第二個運算元;
2.如果第一個運算元隱式轉換為Boolean之後為false,則返回第一個運算元;
3.在&&運算中,但凡運算元中有 null ,undefined ,NaN 這些特殊值,結果就返回這些值。(雖然這些值轉換為Boolean之後為false,但返回是將這些值直接輸出)
- ||或操作符(有真則真,全假則假)
同樣道理,"或"翻譯過來 是或者的意思,只要n個條件中只有1個條件滿足,結果就會返回真。
"或"也遵循“短路”運算,和“與”相反,當表示式1為true,就返回true,停止了對後面表示式的判斷。
舉幾個例項說明一下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>邏輯運算子</title>
<script type="text/javascript">
//當運算元為兩個時,
console.log(5||4+"\n"); // 5隱式轉換之後為true,返回5
console.log(4||5+"\n"); // 4隱式轉換之後為true,返回4
console.log(""||5+"\n"); //空字串轉換之後為false,返回5
console.log(null||5+"\n"); //null隱式轉換之後為false,返回5
console.log(4||undefined+"\n"); //4隱式轉換之後為true,返回4
console.log(NaN||5+"\n"); // NaN隱式轉換之後為false,返回5
//當運算元為3個及以上時,
console.log(5||4||6+"\n"); //結果為真時,返回第一個數的原值 5
</script>
</head>
<body>
</body>
</html>
以兩個運算元為例: (表示式1||表示式2)
1.如果第一個運算元隱式轉換為Boolean之後為true,則返回第一個運算元;
2.如果第一個運算元隱式轉換為Boolean之後為false,則返回第二個運算元;
3.需要注意的是:||運算子不對 null, undefined, NaN 有特殊要求,而是將他們隱式轉換為 false。
- !非運算子(非真即假)
- 對於運算元為非boolean型別的資料
對一個boolean值進行取反操作,即:!true=false !fasle=true
- 對於運算元為非boolean型別的資料
首先將其轉換為Boolean,在進行雙取反(兩次非運算操作)
Var a =10;
console.log(typeof a); // number
console.log(a); //10
a=!!a; // 對a進行兩次取反
console.log(typeof a); //boolean
console.log( a); // true
!!a==Boolean(a) 對a進行的兩次非運算操作相當於是對a進行Bololean的強制型別轉化。
像這種隱式型別轉換用法更靈活,也比較方便,
- Number轉換為String
var a= 123; a=a+""; //相當於 String(a)或者 a.toString() console.log(typeof a); //String console.log(a); //123
- String轉換為Number
var str="12345";
console.log(typeof str); //string
var str=str*1; //相當於Number(str)或parseInt(str)
console.log(typeof str); //number
console.log(str); //12345
所以字串轉化為數字型別,可以通過 str-0, str*1, str/1,這樣的運算實現隱式型別轉換。
另外需要注意的是,唯一沒有+運算子,因為直譯器會認為+號是字串和數字的拼接。