4個未聽說過的強大JavaScript操作符
你有沒有花一個下午的時間來閱讀Mozilla的文檔?如果你有,你就會很清楚,網(wǎng)上有很多關(guān)于JavaScript的信息。這使得人們很容易忽視一些比較生僻的JavaScript操作符。
然而,這些操作符不常見并不意味著它們不強大! 它們各自在語法上看起來很相似,但一定要讀懂每一個,因為它們的工作方式不同。
就讓我們一探究竟吧!
1、 ?? 操作符
在JavaScript中,??運算符被稱為nullish coalescing運算符(零合并操作符)。如果第一個參數(shù)不是null/undefined,這個運算符將返回第一個參數(shù),否則,它將返回第二個參數(shù)。我們來看一個例子。

當(dāng)為一個變量分配默認(rèn)值時,JavaScript開發(fā)人員傳統(tǒng)上依賴邏輯OR運算符,比如這樣。

上面我們創(chuàng)建了一個函數(shù)moneyAmount,負(fù)責(zé)返回用戶的當(dāng)前余額。我們使用了||操作符來識別沒有賬戶的用戶。然而,當(dāng)一個用戶沒有賬戶時是什么意思呢?更準(zhǔn)確的做法是將無賬戶視為null,而不是0,因為銀行賬戶可以存在無(或負(fù))錢的情況。在上面的例子中,||操作符將0視為一個假值,因此沒有登記我們的用戶有一個0美元的賬戶。讓我們通過使用nullish coalescing操作符來解決這個問題。

概括地說,??運算符允許我們分配默認(rèn)值,同時忽略0和空字符串等錯誤值。
2、 ??=操作符
??=又被稱為邏輯空值賦值運算符,與我們之前學(xué)習(xí)的內(nèi)容密切相關(guān)。我們來看看它們是如何聯(lián)系在一起的。

這個賦值操作符只有在當(dāng)前值為空或未定義的情況下才會賦一個新的值。上面的例子強調(diào)了這個操作符本質(zhì)上是空值賦值的語法糖。接下來,讓我們看看這個操作符與默認(rèn)參數(shù)有何不同。

上述函數(shù)在處理空值時有一個值得注意的區(qū)別。默認(rèn)參數(shù)將覆蓋默認(rèn)值與null參數(shù),nullish賦值操作符不會。默認(rèn)參數(shù)和nullish賦值都不會覆蓋未定義的值。在這里閱讀更多內(nèi)容。
3、 ?.?操作符
可選的鏈?zhǔn)讲僮鞣?. 允許開發(fā)人員讀取深嵌在對象鏈中的屬性值,而不必顯式驗證每個引用。當(dāng)一個引用為空時,表達式停止計算并返回一個未定義的值。讓我們來看看一個例子。

現(xiàn)在,讓我們把到目前為止學(xué)到的一切都納入到新的旅行計劃中去吧!

我們現(xiàn)在創(chuàng)建了一個函數(shù),將plans添加到一個當(dāng)前沒有嵌套屬性 tuesday.location 的對象中。我們還使用了nullish運算符來提供默認(rèn)值。這個函數(shù)將接受'0'這樣的虛值作為有效參數(shù)。這意味著我們的預(yù)算可以被設(shè)置為0,而不會出現(xiàn)任何錯誤。
4、 ? 操作符
三元運算符 ? : 需要三個操作數(shù),一個條件為真時要執(zhí)行的表達式,以及一個條件為假時要執(zhí)行的表達式。讓我們來看看它的操作。

如果你在JavaScript上花了一些時間,你可能已經(jīng)看到了三元操作符。然而,你知道三元運算符可以用于變量賦值嗎?

我們甚至可以用它來復(fù)制nullish賦值的行為。

現(xiàn)在讓我們通過創(chuàng)建一個函數(shù)來概括這種行為!

在收尾之前,讓我們使用三元運算符重構(gòu)前面例子中的函數(shù)。

結(jié)論
我們現(xiàn)在已經(jīng)了解了這些運算符能夠完成的基本原理。如果你覺得受到啟發(fā),想在這些例子的基礎(chǔ)上,在這里了解更多關(guān)于這些運算符的信息。干杯!