Javascript 中 || 和 ?? 运算符的区别

在 Javascript 中，|| 和 ?? 运算符有以下区别：

1. || 运算符被称为逻辑或运算符，用于返回第一个为真的操作数。如果第一个操作数为真，则返回第一个操作数；如果第一个操作数为假，则返回第二个操作数。例如：a || b，如果a为真，则返回a；如果a为假，则返回b。

2. ?? 运算符被称为空值合并运算符，用于从两个操作数中选择一个非空的值。如果第一个操作数为 null 或 undefined，则返回第二个操作数；否则返回第一个操作数。例如：a ?? b，如果a为null 或 undefined，则返回b；否则返回a。

3. || 运算符对于所有的假值（例如：null、undefined、0、false、NaN 和空字符串）都会返回第二个操作数。而 ?? 运算符只会返回 null 或 undefined。

4. ?? 运算符的优先级比 || 运算符高，因此在使用这两个运算符时，应注意使用适当的括号来确保表达式的正确性。

综上所述，|| 运算符用于逻辑判断，返回第一个为真的操作数，而 ?? 运算符用于空值合并，返回第一个非空的操作数。

示例

当使用 || 运算符时，如果第一个操作数为真，则返回第一个操作数；如果第一个操作数为假，则返回第二个操作数。以下是一个示例：

// 使用 || 运算符
const a = 0;
const b = 10;

const result = a || b;
console.log(result); // 输出 10，因为 a 为假值，返回了第二个操作数 b

当使用 ?? 运算符时，如果第一个操作数为 null 或 undefined，则返回第二个操作数；否则返回第一个操作数。以下是一个示例：

// 使用 ?? 运算符
const a = null;
const b = 20;

const result = a ?? b;
console.log(result); // 输出 20，因为 a 为 null，返回了第二个操作数 b

需要注意的是，?? 运算符只会返回 null 或 undefined，而 || 运算符对于所有的假值都会返回第二个操作数。例如：

const a = 0;
const b = "";

const result1 = a ?? 10;
console.log(result1); // 输出 0，因为 a 为假值，但不是 null 或 undefined
const result2 = b || "default";
console.log(result2); // 输出 "default"，因为 b 为空字符串，属于假值

在上述示例中，?? 运算符返回了第一个操作数，因为它不是 null 或 undefined。而 || 运算符返回了第二个操作数，因为它是一个假值。