在 JavaScript 中，???是一個邏輯運算符，稱為?空值合并運算符（Nullish Coalescing Operator）。它用于檢查左側的值是否為?null?或?undefined，如果是，則返回右側的值；否則返回左側的值。

語法

javascript

復制

leftExpr ?? rightExpr

• leftExpr: 左側的表達式。

• rightExpr: 右側的表達式。

行為

• 如果?leftExpr?是?null?或?undefined，則返回?rightExpr。

• 如果?leftExpr?不是?null?或?undefined，則返回?leftExpr。

示例

javascript

復制

const value1 = null;
const value2 = undefined;
const value3 = 0;
const value4 = '';
const value5 = 'Hello';console.log(value1 ?? 'default'); // 輸出: 'default'（因為 value1 是 null）
console.log(value2 ?? 'default'); // 輸出: 'default'（因為 value2 是 undefined）
console.log(value3 ?? 'default'); // 輸出: 0（因為 value3 不是 null 或 undefined）
console.log(value4 ?? 'default'); // 輸出: ''（因為 value4 不是 null 或 undefined）
console.log(value5 ?? 'default'); // 輸出: 'Hello'（因為 value5 不是 null 或 undefined）

與?||?的區別

???和?||?都可以用于提供默認值，但它們的行為有所不同：

• ||?會在左側值為?假值（falsy）時返回右側值。假值包括：false、0、''、null、undefined、NaN。

• ???只會在左側值為?null?或?undefined?時返回右側值。

示例對比

javascript

復制

const value1 = 0;
const value2 = '';console.log(value1 || 'default'); // 輸出: 'default'（因為 0 是假值）
console.log(value1 ?? 'default'); // 輸出: 0（因為 0 不是 null 或 undefined）console.log(value2 || 'default'); // 輸出: 'default'（因為 '' 是假值）
console.log(value2 ?? 'default'); // 輸出: ''（因為 '' 不是 null 或 undefined）

使用場景

• 提供默認值: 當你希望僅在值為?null?或?undefined?時使用默認值，而不是其他假值（如?0?或?''）。

• 避免意外行為: 當你需要區分?null/undefined?和其他假值時。

示例場景

javascript

復制

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）

注意事項

• ???的優先級較低，因此在復雜表達式中可能需要使用括號來明確運算順序。

• ???不能直接與?&&?或?||?混合使用，除非用括號明確優先級，否則會拋出語法錯誤。

javascript

復制

// 錯誤示例
const result = a && b ?? c; // 語法錯誤// 正確示例
const result = (a && b) ?? c;

總結

???是一個非常有用的運算符，特別適合在需要區分?null/undefined?和其他假值的場景中使用。它可以幫助你更精確地處理默認值邏輯。