簡單運用
邏輯且(&&)：左右必須都滿足 true 才回傳 true；邏輯或(||)：左右其中一個滿足 true 就回傳 true，
這樣簡單的運用是整體回傳一個布林值，適合在陳述句判斷的時候用：
let user = localStorage.getItem("user");
if (user && user.age > 10) {
// ...
}
當 user 存在時（即 true），且 user 的 age 欄位大于 10，if陳述句得到的布林值才是 true，第一個條件句才執行，
進階運用
上面都是邏輯且和邏輯或的簡單使用，其實它們大有用處，還能簡化代碼，運算子操作的物件稱之為運算元（Operand)，
邏輯且
| 左邊運算元結果 | 右邊運算元結果 | 執行的運算元 | 整體結果 |
|---|---|---|---|
| true | true | 右 | true |
| false | true | 左 | false |
| true | false | 右 | false |
| false | false | 左 | false |
根據上表格得出一個結論：
- 如果左運算元的結果是一個 true，就執行右運算元，
- 如果左運算元的結果是一個 false，就執行左運算元，
假設傳入了回呼函式就執行，否則跳過不執行，一般想到的是用 if 條件陳述句，或者三元運算子簡化 if 條件陳述句，然而，利用邏輯且(&&)的特性可以進一步簡化代碼：
function fun(callback) {
// ...
callback && callback();
}
fun(() => console.log("execute callback function.")); // 控制臺列印了字串！
fun(); // 什么也沒有發生！
邏輯或
| 左邊運算元結果 | 右邊運算元結果 | 執行的運算元 | 整體結果 |
|---|---|---|---|
| true | true | 左 | true |
| false | true | 右 | true |
| true | false | 左 | true |
| false | false | 右 | false |
根據上表得出結論：
- 如果左運算元的結果是一個 true，就執行左運算元，
- 如果左運算元的結果是一個 false，就執行右運算元，
簡而言之，邏輯或(||)一旦遇到運算元的結果是 true，就執行這個運算元，而另一個運算元直接忽略不執行，即“短路”，
邏輯且提供默認值
if 陳述句提供默認值：
function fun(x) {
if (!x) {
x = "default value";
}
console.log(x);
}
fun(undefined); // "default value"
fun("inject a value"); // inject a value
邏輯且提供默認值：
function fun(x) {
x = !x && "default value";
console.log(x);
}
fun(undefined); // "default value"
fun("inject a value"); // false
邏輯且要判斷第一個運算元（左運算元）是不是 false，如果是就直接執行第一個運算元，我本來就有默認值要提供，但第一個運算元就已經截斷了第二個運算元的執行，上面的代碼，為了保證引數提供的是假值而執行第二個運算元的結果，導致傳入非假值回傳的是 false，
可能是我沒有想到更好的方式，所以，我認為邏輯且(&&)不適合用來提供默認值，
邏輯或提供默認值
實際上邏輯或提供默認值才是等價于上面說到的 if 陳述句提供默認值的邏輯：
function fun(x) {
x = x || "default value";
console.log(x);
}
fun(undefined); // "default value"
fun("inject a value"); // inject a value
所以，我認為邏輯或(||)適合提供默認值這一作業，
比較兩者
邏輯或(||)的用處比邏輯且的用途廣，前面說到，邏輯且(&&)不適合提供默認值，而邏輯或(||)既適合提供默認值，也適合做決定是否執行回呼函式等一些列作業，
改造進階運用 - 邏輯且的例子代碼：
function fun(callback) {
// ...
!callback || callback();
}
fun(() => console.log("execute callback function.")); // 控制臺列印了字串！
fun(); // 什么也沒有發生！
更多邏輯或的例子
屬性的默認值
setTitle(options.title || 'untitled');
在給函式傳遞引數時，如果 options.title 是 null 或者其他之類的假值，就提供字串untitled給函式，
函式結果的默認值
function countOccurrences(regex, str) {
return (str.match(regex) || []).length;
}
match()方法會回傳一個陣列或 null，得益于邏輯或(||)，在后一種請看下可以設定一個默認值，因此，在這兩種情況下你都可以安全地訪問 length 屬性，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/503609.html
標籤：JavaScript