js中??是什么意思(示例場(chǎng)景)
更新時(shí)間：2025年04月10日 10:23:25 作者：肖肖肖麗珠
???是一個(gè)非常有用的運(yùn)算符,特別適合在需要區(qū)分?null/undefined?和其他假值的場(chǎng)景中使用,它可以幫助你更精確地處理默認(rèn)值邏輯,本文給大家介紹js中??是什么意思,感興趣的朋友一起看看吧
在 JavaScript 中，?? 是一個(gè)邏輯運(yùn)算符，稱為 空值合并運(yùn)算符（Nullish Coalescing Operator）。它用于檢查左側(cè)的值是否為 null 或 undefined，如果是，則返回右側(cè)的值；否則返回左側(cè)的值。
語(yǔ)法
leftExpr ?? rightExpr
- leftExpr: 左側(cè)的表達(dá)式。
- rightExpr: 右側(cè)的表達(dá)式。
行為
- 如果
leftExpr是null或undefined，則返回rightExpr。 - 如果
leftExpr不是null或undefined，則返回leftExpr。
示例
const value1 = null; const value2 = undefined; const value3 = 0; const value4 = ''; const value5 = 'Hello'; console.log(value1 ?? 'default'); // 輸出: 'default'（因?yàn)?value1 是 null） console.log(value2 ?? 'default'); // 輸出: 'default'（因?yàn)?value2 是 undefined） console.log(value3 ?? 'default'); // 輸出: 0（因?yàn)?value3 不是 null 或 undefined） console.log(value4 ?? 'default'); // 輸出: ''（因?yàn)?value4 不是 null 或 undefined） console.log(value5 ?? 'default'); // 輸出: 'Hello'（因?yàn)?value5 不是 null 或 undefined）
與 || 的區(qū)別
?? 和 || 都可以用于提供默認(rèn)值，但它們的行為有所不同：
||會(huì)在左側(cè)值為 假值（falsy）時(shí)返回右側(cè)值。假值包括：false、0、''、null、undefined、NaN。??只會(huì)在左側(cè)值為null或undefined時(shí)返回右側(cè)值。
示例對(duì)比
const value1 = 0; const value2 = ''; console.log(value1 || 'default'); // 輸出: 'default'（因?yàn)?0 是假值） console.log(value1 ?? 'default'); // 輸出: 0（因?yàn)?0 不是 null 或 undefined） console.log(value2 || 'default'); // 輸出: 'default'（因?yàn)?'' 是假值） console.log(value2 ?? 'default'); // 輸出: ''（因?yàn)?'' 不是 null 或 undefined）
使用場(chǎng)景
- 提供默認(rèn)值: 當(dāng)你希望僅在值為
null或undefined時(shí)使用默認(rèn)值，而不是其他假值（如0或''）。 - 避免意外行為: 當(dāng)你需要區(qū)分
null/undefined和其他假值時(shí)。
示例場(chǎng)景
function greet(name) {
const displayName = name ?? 'Guest';
console.log(`Hello, ${displayName}!`);
}
greet(null); // 輸出: Hello, Guest!
greet(undefined); // 輸出: Hello, Guest!
greet('Alice'); // 輸出: Hello, Alice!
greet(''); // 輸出: Hello, !（空字符串不是 null 或 undefined）注意事項(xiàng)
??的優(yōu)先級(jí)較低，因此在復(fù)雜表達(dá)式中可能需要使用括號(hào)來明確運(yùn)算順序。??不能直接與&&或||混合使用，除非用括號(hào)明確優(yōu)先級(jí)，否則會(huì)拋出語(yǔ)法錯(cuò)誤。
// 錯(cuò)誤示例 const result = a && b ?? c; // 語(yǔ)法錯(cuò)誤 // 正確示例 const result = (a && b) ?? c;
總結(jié)
?? 是一個(gè)非常有用的運(yùn)算符，特別適合在需要區(qū)分 null/undefined 和其他假值的場(chǎng)景中使用。它可以幫助你更精確地處理默認(rèn)值邏輯。
到此這篇關(guān)于js中??是什么意思的文章就介紹到這了,更多相關(guān)js中??內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)選擇題選擇效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-11-11
JavaScript大數(shù)相加相乘的實(shí)現(xiàn)方法實(shí)例
這篇文章主要給大家介紹了關(guān)于JavaScript大數(shù)相加相乘的實(shí)現(xiàn)方法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-10-10
神奇！js+CSS+DIV實(shí)現(xiàn)文字顏色漸變效果
很神奇！js+CSS+DIV實(shí)現(xiàn)文字顏色漸變效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-03-03
jQuery實(shí)現(xiàn)仿百度首頁(yè)滑動(dòng)伸縮展開的添加服務(wù)效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)仿百度首頁(yè)滑動(dòng)伸縮展開的添加服務(wù)效果代碼,通過jQuery相應(yīng)鼠標(biāo)事件控制頁(yè)面元素的動(dòng)態(tài)變換功能,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-09-09
理解javascript中try...catch...finally
這篇文章主要幫助大家理解javascript中try...catch...finally，從淺入深，一步步掌握javascript中try...catch...finally的使用方法，感興趣的小伙伴們可以參考一下2015-12-12
javascript實(shí)現(xiàn)tab響應(yīng)式切換特效
這篇文章主要為大家介紹了javascript實(shí)現(xiàn)tab響應(yīng)式切換特效，以一個(gè)完整的實(shí)例對(duì)tab響應(yīng)式切換特效進(jìn)行詳細(xì)的分析，感興趣的小伙伴們可以參考一下2016-01-01
通過js寫一個(gè)web工程的相關(guān)頁(yè)面時(shí)感覺很卡，修改內(nèi)存也不行下面有兩種解決方法，大家可以嘗試下2013-11-11
這篇文章主要介紹了js實(shí)現(xiàn)的tab標(biāo)簽切換效果，功能非常簡(jiǎn)單，實(shí)現(xiàn)了點(diǎn)擊切換的效果，推薦給大家，有需要的小伙伴可以參考下。2015-09-09
webpack前端應(yīng)用之基礎(chǔ)打包實(shí)現(xiàn)
本文主要介紹了webpack前端應(yīng)用之基礎(chǔ)打包實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02
這篇文章主要為大家詳細(xì)解析了BootStrap圖片樣式、輔助類樣式和CSS組件源碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01