js中的 || 與 && 運算子詳解
這篇文章主要介紹了js中的 || 與 && 運算子詳解,需要的朋友可以參考下
一
js中邏輯運算子在開發中可以算是比較常見的運算子了,主要有三種:邏輯與&&、邏輯或||和邏輯非!。
當&&和|| 連線語句時,兩邊的語句會轉化為布林型別(Boolean),然後再進行運算,具體的運算規則如下:
兩邊條件都為true時,結果才為true;
如果有一個為false,結果就為false;
當第一個條件為false時,就不再判斷後面的條件
注意
當數值參與邏輯與運算時,結果為true,那麼會返回的會是第二個為真的值;如果結果為false,返回的會是第一個為假的值。
二.
只要有一個條件為true時,結果就為true;
當兩個條件都為false時,結果才為false;
當一個條件為true時,後面的條件不再判斷
注意:當數值參與邏輯或運算時,結果為true,會返回第一個為真的值;如果結果為false,會返回第二個為假的值;
三.
當條件為false時,結果為true;反之亦然。
上程式碼說明:
`<!DOCTYPE html>` `<html lang=``"en"``>` `<head>` `<meta charset=``"UTF-8"``>` `<title>demo</title>` `<script>` `console.log( 5 && 4 );``//當結果為真時,返回第二個為真的值4` `console.log( 0 && 4 );``//當結果為假時,返回第一個為假的值0` `console.log( 5 || 4 );``//當結果為真時,返回第一個為真的值5` `console.log( 0 || 0 );``//當結果為假時,返回第二個為假的值0` `console.log((3||2)&&(5||0));``//5` `console.log(!5);``//false` `</script>` `</head>` `<body>` `</body>` `</htm>`
補充:邏輯與的優先順序是高於邏輯或的;
比如console.log(3||2&&5||0),會先算2&&5的值為5,然後再3||5----3,最後再3||0----3,所以最終結果為3.
補充
表示式a && 表示式b : 計算表示式a(也可以是函式)的運算結果,
如果為 True, 執行表示式b(或函式),並返回b的結果;
如果為 False,返回a的結果;
表示式a || 表示式b : 計算表示式a(也可以是函式)的運算結果,
如果為 Fasle, 執行表示式b(或函式),並返回b的結果;
如果為 True,返回a的結果;
轉換規則:
物件為true;
非零數字為true;
零為false;
非空字串為true;
空字串為法false;
其他為false;
例如
var a = obj || " " ; //如果 obj 為空,a就賦值為 " " ;
var a = check() && do(); //如果check()返回為真,就執行do(),並將結果賦值給 a;
其他網友的補充
今天覆習js繼承的時候發現了一個問題,先上程式碼了
`<script type=``"text/javascript"``>`
`window.onload =` `function` `() {`
`var` `mama,`
`mama1,`
`test =` `function` `(name) {`
`debugger;`
`this``.name = name ||` `'mama'``;`
`};`
`debugger;`
`mama =` `new` `test();`
`mama1 =` `new` `test(``"mama1"``);`
`alert(mama.name);``//name = mama`
`alert(mama1.name);``// name = mama1`
`}`
`</script>`
}//歡迎加入全棧開發交流圈一起學習交流:582735936
]//面向1-3年前端人員
} //幫助突破技術瓶頸,提升思維能力
在執行建構函式的時候,無參的建構函式返回的name是’mama’,有引數時,例項的name就是引數值了。 >這個時候我就有點犯迷糊了,為什麼邏輯運算子||能這麼用呢?
由於是C#出身,所以對js ||這樣用感覺很奇怪。
沒轍,不懂先研究,實驗實驗就知道了。
`var` `b, c, d;`
`b =` `true` `|| 0;``//b=true;`
`c =` `false` `|| 0;``//c=0;`
`d = 1 || 0;``//d=1;`
換成別的呢?
`var` `b, c, d;`
`b = 1-1 || 1+1;` `//b=2`
`c =` `function` `() {` `return` `undefined } ||` `function` `() {` `return` `1};``//c=function();`
`d = c();``//d=undefined`
`var` `b, c, d;`
`b = 1-1 || 1+1;` `//b=2`
`c =` `function` `() {` `return` `1 } ||` `function` `() {` `return` `undefined};``//c=function();`
`d = c();``//d=1`
`b = {} || { a: 1, getA:` `function` `() {` `return` `this``.a}};` `//b=object`
image
`var` `b, c, d;`
`b = { a: 1, getA:` `function` `() {` `return` `this``.a } } || {};` `//b=object`
`c = b.getA();``//c=1;`
通過這幾個實驗,可以看出,JS的||並不是像C#裡面的||一樣 單純的返回一個布林型別。
大家都知道js的布林型別判定是物件是true,非零是true,非空字串是true其餘的都是false
由此得出
邏輯或
表示式 | 表示式2 | a取值 |
---|---|---|
1 | 0 | 表示式1結果值 |
1 | 1 | 表示式1結果值 |
0 | 1 | 表示式2結果值 |
0 | 0 | 表示式2結果值 |
邏輯與 && :
var a = 表示式1 && 表示式2
表示式1 | 表示式2 | a取值 |
---|---|---|
1 | 0 | 表示式2結果值 |
1 | 1 | 表示式2結果值 |
0 | 1 | 表示式1結果值 |
0 | 0 | 表示式1結果值 |
主要原因是因為短路,邏輯或 | 在前面有一個ture的時候則不看後面直接停止,邏輯與&&同理。 |
然後計算賦值和我們平時一樣之獲取最新的一次計算結果值。
例如
b = (1 + 1, 2 + 2, 3 + 3);``//b=6;
嘛嘛,當然只是猜測。
以上僅供參考。萌新一隻,望各位大佬輕批。瞭解更多