https://javascript.plainenglish.io/the-nullish-coalescing-operator-in-javascript-explained-with-examples-3e056e49a2c2
原譯 | 楊小二
如今JavaScript 具有許多強大的功能，我們可以在代碼中作為開發人員使用。這是因為 JavaScript 建立者試圖添加盡可能多的功能，以使開發人員更容易編寫 JavaScript 代碼。
我經常看到的功能是邏輯運算符。在舊的 JavaScript 版本中，我們隻有三個邏輯運算符（or、and 和 not）。但是現在有了新的 ECMAScript 規範，我們擁有的遠不止這些。諸如短路運算符、可選連結和無效合并運算符之類的東西。
這就是為什麼在本文中，我們将學習 JavaScript 中的 null 合并運算符。現在，讓我們開始吧。
什麼是無效合并？
無效合并 ?? 是 JavaScript 中我們在兩種資料類型之間使用的邏輯運算符。
運算符檢查兩種資料類型，如果第一種為空或未定義，則傳回第二種資料類型。否則，如果第一個資料類型不為 null 且不為 undefined ，則傳回第一個資料類型而不是第二個資料類型。
這是代碼文法的樣子：
firstData ?? secondData 使用空合并運算符
在空合并運算符 ?? 之前，我們必須使用 OR 運算符，如果我們想為變量提供預設值||。如你所知，運算符 ||有點類似于空合并運算符。唯一的差別是 OR 運算符 ||檢查所有假值，而不僅僅是 null 和 undefined 。
順便說一下，如果你不知道 JavaScript 中的假值是什麼。在這裡，我可以列舉一下，它們是：false 、 0 、 null 、 undefined 、 NaN 、 -0、 0n 和 "" （空字元串）。
現在的問題是運算符 ||并非在所有情況下都有用。因為它會檢查并避免所有假值。例如，有時在我們的程式中需要 0 和空字元串作為有效選項的情況。我們不能用 OR 運算符做到這一點。
這就是無效合并運算符發揮作用的原因。它隻覆寫 null 和 undefined 。
這是一個比較 OR 運算符和空合并運算符的示例：
使用 OR 運算符：
//Give an empty string as a name for a variable.
let name = "";
/*using the OR operator to give a default name(John) for our variable.*/
let setName = name || "John";
console.log(setName); //prints: "John" because "" is a falsy value. 使用空合并運算符：
//Give an empty string as a name for a variable.
let name = "";
//using the nullish coalescing operator.
let setName = name ?? "Mehdi";
console.log(setName); /*prints: ""(empty string) because the first data type(name)is not null and not undefined.*/ 如你所見，這就是兩個運算符之間的差別。空合并運算符的好處在于它檢查第一個資料類型是 null 還是 undefined 。如果是，則傳回第二種資料類型。否則，它傳回第一個資料類型。
這是另一個示例，可以讓你清楚地了解：
let name = "John";
let age = null;
let setName = name ?? "Mehdi";
console.log(setName); /*prints "John" because name is not null or undefined*/
let setAge = age ?? 21;
console.log(setAge); //prints 21 because age is null. 我們可以僅使用條件語句和 OR 運算符編寫上述相同的代碼，以向你展示空合并運算符的工作原理以及為什麼它更簡潔、更短。
這是示例：
let name = "John";
let age = null;
let setName;
if(name === null || name === undefined){
setName = "Mehdi";
}else{
setName = name;
}
if(age === null || age === undefined){
setAge = 21;
}else{
setAge = age;
}
console.log(setName); //John
console.log(setAge); //21 這就是我們如何使用條件實作同樣的事情。這比使用 null 合并運算符要困難得多，而且代碼對我來說也不簡潔。這就是為什麼在這種情況下推薦使用 null 合并運算符的原因。
浏覽器支援情況
IE 以及最舊版本的 Chrome 和 Safari 不支援空合并運算符。但是，除 Opera mobile 之外的所有最新版本都支援它。
這是浏覽器支援情況的截圖：
結論
如你所見，空合并運算符比你想象的要簡單得多。它隻覆寫 null 和 undefined 的值。我将始終推薦使用它，因為它使代碼更清晰且易于編寫。
感謝你閱讀這篇文章，希望你覺得它有用。