關系運算符
-
為什么要學習關系運算符?
- 默認情況下,我們在程序中寫的每一句正確代碼都會被執行。但很多時候,我們想在某個條件成立的情況下才執行某一段代碼
- 這種情況的話可以使用條件語句來完成,但是學習條件語句之前,我們先來看一些更基礎的知識:如何判斷一個條件成不成立。
-
JavaScript中的真假性
- 在JavaScript中,條件成立稱為“真”,條件不成立稱為“假”,因此,判斷條件是否成立就是判斷條件的“真假”。
- 在JavaScript已經給我們定義好了一個Boolean類型的值, 取值是true和false, true代表真, false代表假
- 而接下來我們要學習的關系運算符它的返回值正好就是Boolean類型的值, 也就是說關系運算符的返回值要么是true,要么是false
-
關系運算符
- 在程序中經常需要比較兩個量的大小關系,以決定程序下一步的工作。比較兩個量的運算符稱為關系運算符。
序號 | 運算符 | 結合性 | |
---|---|---|---|
1 | > | 大于 | 左結合 |
2 | < | 小于 | 左結合 |
3 | >= | 大于等于 | 左結合 |
4 | <= | 小于等于 | 左結合 |
5 | == | 判斷值是否相等 | 左結合 |
6 | != | 判斷值是否不相等 | 左結合 |
7 | === | 判斷值和類型是否相等 | 左結合 |
8 | !== | 判斷值和類型是否不相等 | 左結合 |
- 簡單示例
var a, b;
a = 10;
b = 10;
console.log(a > b); // false
console.log(a < b); // false
console.log(a >= b); // true
console.log(a <= b); // true
console.log(a == b); // true
console.log(a != b); // false
-
特殊示例
-
對于非數值進行比較時,會將其轉換為數字然后在比較
console.log(1 > true); //false console.log(1 >= false); //true console.log(1 > "0"); //true console.log(1 > null); //true
如果符號兩側的值都是字符串時,不會將其轉換為數字進行比較, 而會分別比較字符串中字符的Unicode編碼
-
// a的Unicode編碼是:0061 // b的Unicode編碼是:0062 console.log("a" < "b");//true // 比較多位時則是從前往后一位一位比較 // 第一位相同比較第二位, 直到比較到不一樣或者結束為止 // c的Unicode編碼是:0063 console.log("ab" < "ac");//true
-
null、undefined 、NaN比較
console.log(null == 0); // false console.log(undefined == 0); // false // 永遠不要判斷兩個NaN是否相等 console.log(NaN == NaN); // false /* * 可以通過isNaN()函數來判斷一個值是否是NaN * 如果該值是NaN則返回true,否則返回false */ var num = NaN; console.log(isNaN(num)); // true // undefined 衍生自 null, 所以返回true console.log(null == undefined); // true; console.log(null === undefined); // false; // == 判斷值是否相等 // == 會進行數據類型轉換 console.log("123" == 123); // true // === 判斷值和類型時候同時相等 // === 不會進行數據類型轉換 console.log("123" === 123); // false
-
-Tips: 利用Unicode編碼可以在控制臺和網頁中輸出一些牛逼的符號
// 在控制臺中直接使用Unicode編碼即可 console.log("\u2764"); // ? // 在網頁中需要以&#開頭, 然后將十六進制2764轉換為十進制 <div>❤</div>
邏輯運算符
- 為什么要學習邏輯運算符?
有時候,我們需要在多個條件同時成立的時候才能執行某段代碼
比如:用戶只有同時輸入了QQ和密碼,才能執行登錄代碼,如果只輸入了QQ或者只輸入了密碼,就不能執行登錄代碼。這種情況下,我們就要借助于JavaScript提供的邏輯運算符。
-
JavaScript中提供了三種邏輯運算符:
&&(與運算) ||(或運算) !(非運算)
邏輯與
格式: 條件A && 條件B
-
運算結果:
- 只有當條件A和條件B都成立時,結果才為true;其余情況的結果都為false。因此,條件A或條件B只要有一個不成立,結果都為false
- 口訣:一假則假
-
邏輯與運算過程
總是先判斷條件A是否成立
如果條件A成立,接著再判斷條件B是否成立:如果條件B成立,“條件A && 條件B”的結果就為true,如果條件B不成立,結果就為false
-
如果條件A不成立,就不會再去判斷條件B是否成立:因為條件A已經不成立了,不管條件B如何結果肯定是false
//如果兩個值都是true則返回true var result = true && true; //只要有一個false,就返回false result = true && false; result = false && true; result = false && false;
-
邏輯與短路現象
//第一個值為true,會檢查第二個值 true && alert("這哥們來了!!"); //第一個值為false,不會檢查第二個值 false && alert("這哥們不會來了!!");
-
注意點:
對于非Boolean類型的數值, 邏輯與會將其悄悄咪咪轉換為Boolean類型來判斷
如果條件A不成立, 則返回條件A的數值本身
-
如果條件A成立, 不管條件B成不成立都返回條件B數值本身
var result = "123" && "abc"; console.log(result); // "abc" result = "123" && 0; console.log(result); // 0 result = null && 0; console.log(result); // null
邏輯或
格式: 條件A || 條件B
-
運算結果:
- 當條件A或條件B只要有一個成立時(也包括條件A和條件B都成立),結果就為true;只有當條件A和條件B都不成立時,結果才為false
- 口訣:一真為真
-
邏輯或運算過程
總是先判斷條件A是否成立
如果條件A成立,就不會再去判斷條件B是否成立:因為條件A已經成立了,不管條件B如何結果肯定是1,也就是true
-
如果條件A不成立,接著再判斷條件B是否成立:如果條件B成立,“條件A || 條件B”的結果就為true,如果條件B不成立,結果就為false
//兩個都是false,則返回false var result = false || false; //只有有一個true,就返回true result = true || false; result = false || true ; result = true || true ;
-
邏輯或短路現象
//第一個值為false,則會檢查第二個值 false || alert("123"); //第一個值為true,則不再檢查第二個值 true || alert("123");
-
注意點:
對于非Boolean類型的數值, 邏輯與會將其悄悄咪咪轉換為Boolean類型來判斷
如果條件A不成立, 則不管條件B成不成立都返回條件B數值本身
-
如果條件A成立, 則返回條件A的數值本身
var result = null || 0; console.log(result); // 0 result = "123" || "abc"; console.log(result); // "123" result = "123" || 0; console.log(result); // "123"
邏輯非
格式: ! 條件A
-
運算結果:
其實就是對條件A進行取反:若條件A成立,結果就為false;若條件A不成立,結果就為true。也就是說:真的變假,假的變真。
-
口訣:真變假,假變真
var bool1 = true; var res1 = !bool1; console.log(res1); // false var bool2 = false; var res2 = !bool2; console.log(res2); // true
-
注意點:
-
對一個值進行兩次取反,它不會變化
var bool = true; var res = !!bool; console.log(res); // true
-
對非布爾值進行元素,則會將其轉換為布爾值,然后再取反
var num = 10; var res = !num; // 先將10轉換為true, 然后再取反 console.log(res); // false
所以, 要想將其它類型轉換為Number類型除了Boolean()函數, 還可以使用
!!數值;
值得注意的是
!!數值;
的形式,實現原理和Boolean()函數一樣
-