資訊專欄INFORMATION COLUMN
摘要：然而，和運(yùn)算符會(huì)返回一個(gè)指定操作數(shù)的值，因此，這些運(yùn)算符也用于非布爾值。例如返回值為返回值為返回值為除此之外的值，都會(huì)讓判斷繼續(xù)執(zhí)行，直到最后一個(gè)值。
JS中邏輯運(yùn)算符 && 的理解 從一個(gè)場景開始
我們試想這樣一個(gè)場景，有這樣一個(gè)對象，其數(shù)據(jù)結(jié)構(gòu)為：
const obj = {
a: {
b: {
c: "i am c"
}
}
}
要求是，寫一個(gè)函數(shù) printLast(value)，將上述的對象的 obj.a.b.c 的值返回出來，否則，就返回 "nothing"。
對于一個(gè)初學(xué)者，代碼可能是這樣的：
function printLast (obj) {
if (obj != null) {
if (obj.a != null) {
if (obj.a.b != null) {
if (obj.a.b.c != null) {
return obj.a.b.c
}
}
}
} else {
return "nothing"
}
}
還有一種不太嚴(yán)謹(jǐn)?shù)膶懛ǎ?/p>
function printLast (obj) {
try {
if (obj.a.b.c != null) {
return obj.a.b.c
} else {
return "nothing"
}
} catch (error) {
return "nothing"
}
}
對于稍有經(jīng)驗(yàn)的開發(fā)者，代碼可能是這樣的：
function printLast (obj) {
if (obj != null && obj.a != null && obj.a.b !=null && obj.a.b.c != null) {
return obj.a.b.c
} else {
return "nothing"
}
}
或者
function printLast (obj) {
if (obj && obj.a && obj.a.b && obj.a.b.c) {
return obj.a.b.c
} else {
return "nothing"
}
}
最后一種寫法才是比較成熟的，但是其作者不一定知道 && 的執(zhí)行邏輯。
步入正題首先，我們回顧以下 && 的執(zhí)行邏輯。
&& 的執(zhí)行邏輯官方的描述：
邏輯運(yùn)算符通常用于布爾型（邏輯）值。這種情況下，它們返回一個(gè)布爾值。然而，&& 和 || 運(yùn)算符會(huì)返回一個(gè)指定操作數(shù)的值，因此，這些運(yùn)算符也用于非布爾值。這時(shí)，它們也就會(huì)返回一個(gè)非布爾型值。
大概的意思就是：&& 不僅可以用于布爾型的值，還可以用于非布爾值，并且返回的結(jié)果可以是任何類型的值，例如：
let bool = true && (3 === 4) // 返回值為 true
let bool = true && "haha" // 返回值為"haha"
let bool = true && (() => { return "haha" }) // 返回值為一個(gè)匿名函數(shù): () => { return "haha" }
這樣的話，問題來了，什么樣的值才能讓 && 短路呢？
官方的描述，以下這些值能讓 && 判斷短路：
null；
NaN；
0；
空字符串（"" or "" or ``）；
undefined。
例如：
let bool = "haha" && 1 && null && true // 返回值為 null let bool = "haha" && 1 && 0 && true // 返回值為 0 let bool = "haha" && 1 && "" && true // 返回值為 ""
除此之外的值，都會(huì)讓 && 判斷繼續(xù)執(zhí)行，直到最后一個(gè)值。
簡單使用根據(jù)上述，我們?nèi)绾谓鉀Q一開始的問題呢？答案是： 很簡單，請看：
function printLast (obj) {
let res = obj && obj.a && obj.a.b && obj.a.b.c // 如果obj.a.b.c存在返回其值，否則，返回undefined
return !!res ? res : "nothing"http:// !! 和 if 一樣，能將各種類型的值轉(zhuǎn)化為布爾量
}
或者
function printLast (obj) {
return (obj && obj.a && obj.a.b && obj.a.b.c) || "nothing" // 如果obj.a.b.c存在返回其值，否則，返回"nothing"
}
因?yàn)?&& 的執(zhí)行是短路的， 所以當(dāng)遇到undefined時(shí)，就會(huì)停止判斷。
在這里，沒有討論js的邏輯運(yùn)算符 || ，原因是只要理解了 && 的執(zhí)行邏輯， || 的也就理解了，不是嗎？
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/105744.html
摘要：如果第一項(xiàng)的值為時(shí)，則執(zhí)行后面一項(xiàng)的運(yùn)算，返回的是第二項(xiàng)執(zhí)行運(yùn)算后的值再來看多一個(gè)例子，自己多動(dòng)手嘗試看看就明白了。 先來看一個(gè)關(guān)于邏輯或的例子： var b = 0 var a = b++ || b++ console.log(b) // 2 var c = ++b || ++b console.log(a) // 1 console.log(c) //...
摘要：為什么比優(yōu)先級(jí)高起因偶然在網(wǎng)上搜索運(yùn)算符優(yōu)先級(jí)，幾乎每個(gè)版本都告訴讀者比優(yōu)先級(jí)更高，包括這樣的權(quán)威網(wǎng)站也不例外。這與自己經(jīng)驗(yàn)不符它們應(yīng)該是優(yōu)先級(jí)一樣的。 為什么 && 比 || 優(yōu)先級(jí)高？ 起因 偶然在網(wǎng)上搜索 js 運(yùn)算符優(yōu)先級(jí)，幾乎每個(gè)版本都告訴讀者 && 比 || 優(yōu)先級(jí)更高，包括 MSN 這樣的權(quán)威網(wǎng)站也不例外。 MDN Operator_Precedence 這與自己經(jīng)驗(yàn)不符...
摘要：中的符號(hào)運(yùn)算方法只要前面為不管后面是還是，都返回后面的值。舉個(gè)栗子位運(yùn)算符運(yùn)算方法兩個(gè)位只要有一個(gè)為，那么結(jié)果都為。否則就為繼續(xù)舉栗子運(yùn)算符還能進(jìn)行取整運(yùn)算位運(yùn)算符運(yùn)算方法兩個(gè)數(shù)值的個(gè)位分別相與，同時(shí)為才得，只要一個(gè)為就為。 1、JS中的||符號(hào)： 運(yùn)算方法： 只要||前面為false,不管||后面是true還是false，都返回||后面的值。 只要||前面為true,不管||后...
摘要：這個(gè)時(shí)候我就有點(diǎn)犯迷糊了，為什么邏輯運(yùn)算符能這么用呢由于是出身，所以對這樣用感覺很奇怪。 這篇文章主要介紹了js中的 || 與 && 運(yùn)算符詳解,需要的朋友可以參考下 一 js中邏輯運(yùn)算符在開發(fā)中可以算是比較常見的運(yùn)算符了，主要有三種：邏輯與&&、邏輯或||和邏輯非！。 當(dāng)&&和|| 連接語句時(shí)，兩邊的語句會(huì)轉(zhuǎn)化為布爾類型（Boolean），然后再進(jìn)行運(yùn)算，具體的運(yùn)算規(guī)則如下： 兩邊條...
摘要：這個(gè)時(shí)候我就有點(diǎn)犯迷糊了，為什么邏輯運(yùn)算符能這么用呢由于是出身，所以對這樣用感覺很奇怪。 這篇文章主要介紹了js中的 || 與 && 運(yùn)算符詳解,需要的朋友可以參考下 一 js中邏輯運(yùn)算符在開發(fā)中可以算是比較常見的運(yùn)算符了，主要有三種：邏輯與&&、邏輯或||和邏輯非！。 當(dāng)&&和|| 連接語句時(shí)，兩邊的語句會(huì)轉(zhuǎn)化為布爾類型（Boolean），然后再進(jìn)行運(yùn)算，具體的運(yùn)算規(guī)則如下： 兩邊條...
閱讀 2335·2023-04-25 14:29
閱讀 1457·2021-11-22 09:34
閱讀 2702·2021-11-22 09:34
閱讀 3392·2021-11-11 10:59
閱讀 1851·2021-09-26 09:46
閱讀 2222·2021-09-22 16:03
閱讀 1921·2019-08-30 12:56
閱讀 479·2019-08-30 11:12
