日本进口yamawa_余姚网页设计公司_佛山网站优化服务_网站开发工程师

在 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 和其他假值的场景中使用。它可以帮助你更精确地处理默认值逻辑。