在 Javascript 中,||
和 ??
运算符有以下区别:
-
||
运算符被称为逻辑或运算符,用于返回第一个为真的操作数。如果第一个操作数为真,则返回第一个操作数;如果第一个操作数为假,则返回第二个操作数。例如:a || b
,如果a为真,则返回a;如果a为假,则返回b。 -
??
运算符被称为空值合并运算符,用于从两个操作数中选择一个非空的值。如果第一个操作数为null
或undefined
,则返回第二个操作数;否则返回第一个操作数。例如:a ?? b
,如果a为null
或undefined
,则返回b;否则返回a。 -
||
运算符对于所有的假值(例如:null
、undefined
、0
、false
、NaN
和空字符串)都会返回第二个操作数。而??
运算符只会返回null
或undefined
。 -
??
运算符的优先级比||
运算符高,因此在使用这两个运算符时,应注意使用适当的括号来确保表达式的正确性。
综上所述,||
运算符用于逻辑判断,返回第一个为真的操作数,而 ??
运算符用于空值合并,返回第一个非空的操作数。
示例
当使用 ||
运算符时,如果第一个操作数为真,则返回第一个操作数;如果第一个操作数为假,则返回第二个操作数。以下是一个示例:
// 使用 || 运算符
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
。而 ||
运算符返回了第二个操作数,因为它是一个假值。