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