JavaScript?邏輯且(&&)和邏輯或(||)的運用小結
簡單運用
邏輯且(&&):左右必須都滿足 true 才返回 true;邏輯或(||):左右其中一個滿足 true 就返回 true。
這樣簡單的運用是整體返回一個布爾值,適合在語句判斷的時候用:
let user = localStorage.getItem("user"); if (user && user.age > 10) { // ... }
當 user 存在時(即 true),且 user 的 age 字段大于 10,if
語句得到的布爾值才是 true,第一個條件句才執(zhí)行。
進階運用
上面都是邏輯且和邏輯或的簡單使用,其實它們大有用處,還能簡化代碼。運算符操作的對象稱之為操作數(shù)(Operand)。
邏輯且
左邊操作數(shù)結果 | 右邊操作數(shù)結果 | 執(zhí)行的操作數(shù) | 整體結果 |
---|---|---|---|
true | true | 右 | true |
false | true | 左 | false |
true | false | 右 | false |
false | false | 左 | false |
根據(jù)上表格得出一個結論:
- 如果左操作數(shù)的結果是一個 true,就執(zhí)行右操作數(shù)。
- 如果左操作數(shù)的結果是一個 false,就執(zhí)行左操作數(shù)。
假設傳入了回調(diào)函數(shù)就執(zhí)行,否則跳過不執(zhí)行。一般想到的是用 if 條件語句,或者三元運算符簡化 if 條件語句。然而,利用邏輯且(&&)的特性可以進一步簡化代碼:
function fun(callback) { // ... callback && callback(); } fun(() => console.log("execute callback function.")); // 控制臺打印了字符串! fun(); // 什么也沒有發(fā)生!
邏輯或
左邊操作數(shù)結果 | 右邊操作數(shù)結果 | 執(zhí)行的操作數(shù) | 整體結果 |
---|---|---|---|
true | true | 左 | true |
false | true | 右 | true |
true | false | 左 | true |
false | false | 右 | false |
根據(jù)上表得出結論:
- 如果左操作數(shù)的結果是一個 true,就執(zhí)行左操作數(shù)。
- 如果左操作數(shù)的結果是一個 false,就執(zhí)行右操作數(shù)。
簡而言之,邏輯或(||)一旦遇到操作數(shù)的結果是 true,就執(zhí)行這個操作數(shù),而另一個操作數(shù)直接忽略不執(zhí)行,即“短路”。
邏輯且提供默認值
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
邏輯且要判斷第一個操作數(shù)(左操作數(shù))是不是 false,如果是就直接執(zhí)行第一個操作數(shù)。我本來就有默認值要提供,但第一個操作數(shù)就已經(jīng)截斷了第二個操作數(shù)的執(zhí)行。上面的代碼,為了保證參數(shù)提供的是假值而執(zhí)行第二個操作數(shù)的結果,導致傳入非假值返回的是 false。
可能是我沒有想到更好的方式,所以,我認為邏輯且(&&)不適合用來提供默認值。
邏輯或提供默認值
實際上邏輯或提供默認值才是等價于上面說到的 if 語句提供默認值的邏輯:
function fun(x) { x = x || "default value"; console.log(x); } fun(undefined); // "default value" fun("inject a value"); // inject a value
所以,我認為邏輯或(||)適合提供默認值這一工作。
比較兩者
邏輯或(||)的用處比邏輯且的用途廣。前面說到,邏輯且(&&)不適合提供默認值,而邏輯或(||)既適合提供默認值,也適合做決定是否執(zhí)行回調(diào)函數(shù)等一些列工作。
改造進階運用 - 邏輯且的例子代碼:
function fun(callback) { // ... !callback || callback(); } fun(() => console.log("execute callback function.")); // 控制臺打印了字符串! fun(); // 什么也沒有發(fā)生!
更多邏輯或的例子
屬性的默認值
setTitle(options.title || 'untitled');
在給函數(shù)傳遞參數(shù)時,如果 options.title 是 null 或者其他之類的假值,就提供字符串untitled
給函數(shù)。
函數(shù)結果的默認值
function countOccurrences(regex, str) { return (str.match(regex) || []).length; }
match()
方法會返回一個數(shù)組或 null。得益于邏輯或(||),在后一種請看下可以設置一個默認值。因此,在這兩種情況下你都可以安全地訪問 length 屬性。
到此這篇關于JavaScript 邏輯且(&&)和邏輯或(||)的妙用的文章就介紹到這了,更多相關JavaScript 邏輯且(&&)和邏輯或(||)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
在Z-Blog中運行代碼[html][/html](純JS版)
在Z-Blog中運行代碼[html][/html](純JS版)...2007-03-03JavaScript實現(xiàn)解析INI文件內(nèi)容的方法
這篇文章主要介紹了JavaScript實現(xiàn)解析INI文件內(nèi)容的方法,結合實例形式分析了javascript通過自定義函數(shù)實現(xiàn)針對ini文件解析操作的相關處理技巧,需要的朋友可以參考下2016-11-11