400 186 1886
目前工作中是多人協(xié)作的項(xiàng)目，有時(shí)候交叉幫忙所以看過很多很多人的代碼了，感覺很少看到有人用這幾個(gè)邏輯運(yùn)算符，但這幾個(gè)邏輯運(yùn)算符出來(lái)也挺久了，總得認(rèn)識(shí)認(rèn)識(shí)，下面一個(gè)個(gè)舉例說明一下具體用法熟悉一下。
一、可選鏈接 (?.)
簡(jiǎn)單介紹：如果引用為空，依然可以正常訪問嵌套的屬性，并不會(huì)出現(xiàn)錯(cuò)誤。即
?.運(yùn)算符的功能與.鏈接運(yùn)算符的區(qū)別在于，如果引用為空或者未定義（null或undefined），則表達(dá)式會(huì)短路并且返回未定義的值，而不會(huì)直接報(bào)錯(cuò)。
代碼示例：
javascript
體驗(yàn)AI代碼助手
代碼解讀
復(fù)制代碼let user = {
name: "天天鴨",
address: {
city: "廣州"
}
};
console.log(user.address.city); // 廣州
let user2 = {
name: "天天鴨"
};
console.log(user2.address?.city); // undefined
在上述示例中，由于 user2 沒有 address 屬性，所以如果使用 user2.address.city 訪問通常會(huì)報(bào)錯(cuò) TypeError....。但是通過使用可選鏈接運(yùn)算符 (?.)，JavaScript 只會(huì)返回 undefined 而不是拋出錯(cuò)誤。
注意：
?.只會(huì)檢查右側(cè)的屬性是否為null或undefined，如果右側(cè)的操作數(shù)是一個(gè)空對(duì)象 {}，那么它會(huì)繼續(xù)執(zhí)行后續(xù)的屬性訪問或方法調(diào)用。- 如果在訪問屬性或調(diào)用方法的過程中遇到
null或undefined，那么整個(gè)表達(dá)式的結(jié)果都會(huì)是undefined。
二、空合并運(yùn)算符 (??)
簡(jiǎn)單介紹：空合并運(yùn)算符
(??)邏輯運(yùn)算符，當(dāng)左側(cè)內(nèi)容為null或undefined時(shí)，它會(huì)返回右側(cè)內(nèi)容，否則返回其左側(cè)內(nèi)容。當(dāng)想要值可能為null或undefined的變量提供默認(rèn)值時(shí)，這會(huì)很實(shí)用。
代碼示例：
ini
體驗(yàn)AI代碼助手
代碼解讀
復(fù)制代碼let name = null;
let defaultName = "天天鴨";
let result = name ?? defaultName;
console.log(result); // 天天鴨
在上述示例中，由于 name 為 null，因此合并運(yùn)算符返回 defaultName，因此起到默認(rèn)值效果。 但如果 name 不為 null 或undefined，則會(huì)返回下面例子該值：
ini
體驗(yàn)AI代碼助手
代碼解讀
復(fù)制代碼let name = "我是name";
let defaultName = "天天鴨";
let result = name ?? defaultName;
console.log(result); // 我是name
注意：
??操作符只在左側(cè)操作數(shù)為null或undefined時(shí)才返回右側(cè)操作數(shù)，如果想要區(qū)分null/undefined與其他假值（如0、''、false）的場(chǎng)景特別有用。- 注意與邏輯或
(||)的區(qū)別：如果左側(cè)操作數(shù)是任何假值（false, 0, NaN, null, undefined, ""），則返回右側(cè)操作數(shù)。而且??只會(huì)識(shí)別null或undefined。
三、空值合并賦值操作符 (??=)
簡(jiǎn)單介紹：空值合并賦值操作符
(??=)結(jié)合了空值合并操作符和賦值操作符功能，一般用于將默認(rèn)值分配給變量，但僅只有變量的值為 null 或 undefined 時(shí)才行。
代碼示例：
ini
體驗(yàn)AI代碼助手
代碼解讀
復(fù)制代碼let name = null;
let age = undefined;
let count = 0;
name ??= 'default'; // 'default'，因?yàn)?name 是 null
age ??= 'default'; // 'default'，因?yàn)?age 是 undefined
count ??= 'default'; // 0， 因?yàn)?count 的初始值不是 null 或 undefined
當(dāng)變量沒有被賦值或被賦值為 null 或 undefined 時(shí)，則會(huì)將默認(rèn)值分配給變量。
注意：
- 如果變量已經(jīng)是某個(gè)假值（如
false、0或''），??=不會(huì)改變它的值
四、轉(zhuǎn)換為布爾值 (!!)
簡(jiǎn)單介紹：
!!運(yùn)算符用于將值轉(zhuǎn)換為布爾值。第一個(gè) ！否定該值，將其轉(zhuǎn)換為布爾值并將其反轉(zhuǎn)，第二個(gè) ! 將其反轉(zhuǎn)回其原始布爾值。
代碼示例：
ini
體驗(yàn)AI代碼助手
代碼解讀
復(fù)制代碼let value = "天天鴨";
let yValue = "";
console.log(!!value); // true
console.log(!!yValue); // false
上述示例中，value 是一個(gè)非空字符串，在 JavaScript 中被視為 true 值，因此 !!value 返回 true。另一方面， yValue 是一個(gè)空字符串，在 JavaScript 中被視為 false 值，因此 !!yValue 返回 false。
小結(jié)：
這些比較新的邏輯運(yùn)算符基本都是在 ECMAScript 2020 標(biāo)準(zhǔn)中引入的，總結(jié)下來(lái)就會(huì)發(fā)現(xiàn)主要是針對(duì)null 或和undefined的，可能很多人平時(shí)都不習(xí)慣去使用，但不喜歡用起碼要懂啊，所以才分享出來(lái)，大佬們?nèi)绻惺裁唇ㄗh也歡迎指導(dǎo)哈。
