JavaScript 中的空合併運算子`??`

在本部落格中，我們將探索 JavaScript 中的空合併運算子 ??。我們將其與邏輯 OR 運算符 || 進行比較，討論其優先級，並提供實際範例來幫助您理解其用法。讓我們潛入吧！

空值合併運算子??

空值合併運算子 ?? 用於處理 null 或 undefined 時提供預設值。當左側運算元為 null 或 undefined 時，它會傳回右側運算元。否則，它會傳回左側操作數。

文法：

result = value1 ?? value2;

範例：

let user = null;
let defaultUser = "Guest";

let currentUser = user ?? defaultUser;
console.log(currentUser); // Output: "Guest"

說明：

• 使用者 為空。
• ?? 運算子回傳 defaultUser，因為 user 為 null。

與 || 比較

邏輯或運算子||傳回它遇到的第一個真值。這表示如果左運算元為假，它將傳回右邊操作數(false, 0, "", null、 未定義、NaN）。

範例：

let user = "";
let defaultUser = "Guest";

let currentUser = user || defaultUser;
console.log(currentUser); // Output: "Guest"

說明：

• user 是一個空字串 ""（假）。
• || 運算子回傳 defaultUser，因為 user 為假。

主要差異

• ??：僅將 null 和 未定義 視為虛假值。
• ||：考慮所有假值(false, 0, "", null", null,, 
null

,未定義

，NaN）。

let user = 0;
let defaultUser = "Guest";

let currentUser1 = user ?? defaultUser;
let currentUser2 = user || defaultUser;

console.log(currentUser1); // Output: 0
console.log(currentUser2); // Output: "Guest"

範例：

• 說明： 使用者 是 0
（對於
• || 為假，但對於 ?? 則不然）。 ?? 運算子回傳 0，因為 user
不為 
• null 或 未定義null 或 未定義null
 或

未定義

。

||

 運算子回傳「Guest」，因為使用者是假的。 優先權

空合併運算子 ??
的優先權低於大多數其他運算符，包括邏輯 OR 運算子

||

let a = null;
let b = false;
let c = "Hello";

let result1 = a ?? b || c;
let result2 = a || b ?? c;

console.log(result1); // Output: "Hello"
console.log(result2); // Output: "Hello"

。這表示涉及

?? 的表達式在涉及 ||

.

的表達式之後求值
• 範例： 說明： 一個?? b
 回傳
• false，因為a 為null，且b 為 為
🎜>。
• 假|| c 回傳「Hello」，因為false是假，而c是真。 一個|| b
 回傳
• false，因為a 為null，且b 為false。

假的？ ？ c

 回傳「Hello」，因為

false

 不是

null

或未定義。

function getUserName(user) {
  return user.name ?? "Guest";
}

let user1 = { name: "Alice" };
let user2 = { age: 25 };

console.log(getUserName(user1)); // Output: "Alice"
console.log(getUserName(user2)); // Output: "Guest"

實際範例

讓我們用一些實際範例將所有內容放在一起：
• 使用?? 對於預設值 說明：
如果

user.name

 為null或

未定義

function getUserName(user) {
  return user.name || "Guest";
}

let user1 = { name: "" };
let user2 = { age: 25 };

console.log(getUserName(user1)); // Output: "Guest"
console.log(getUserName(user2)); // Output: "Guest"

，則

??操作符返回“Guest”

. 使用|| 對於預設值 說明：

• 如果 user.name 為假（例如，""），則 || 運算子回傳 「Guest」。

總結

• ?? （空白合併運算子）：若左側運算元為 null 或 未定義，則傳回右邊運算元。
• || （邏輯或運算子）：傳回遇到的第一個真值。
• 優先權：?? 運算子的優先權低於 || 運算子。

結論

空值合併運算子 ?? 是 JavaScript 中的強大工具，用於在處理 null 或 undefined 時提供預設值。透過了解它與邏輯 OR 運算子 || 的區別及其優先級，您將能夠編寫更健壯且無錯誤的程式碼。不斷練習和探索，加深對 JavaScript 中 nullish 合併運算子的理解。

請繼續關注更多關於 JavaScript 的深入部落格！快樂編碼！

以上是JavaScript 中的空合併運算子`??`的詳細內容。更多資訊請關注PHP中文網其他相關文章！