解析JavaScript中逻辑运算符&&和||的返回值机制

本文主要内容：了解逻辑运算符 &&（逻辑与）和 ||（逻辑或）的返回值。

在JavaScript中，逻辑运算符 &&（逻辑与）和 ||（逻辑或）的返回值可能并不总是布尔值（true 或 false）。它们的返回值取决于它们操作的操作数的值。以下是关于这两个运算符详细解析：

逻辑与（&&）

如果第一个操作数的值为 falsy（例如：false、0、""、null、undefined、NaN），则整个表达式的结果就是这个 falsy 的值，并且不会计算第二个操作数。

如果第一个操作数的值为 truthy（任何不是 falsy 的值），则整个表达式的结果就是第二个操作数的值。

console.log(false && "hello"); // 输出：false  
console.log(true && "hello");  // 输出："hello"  
console.log(0 && "hello");     // 输出：0  
console.log("hello" && "world"); // 输出："world"

 逻辑或（||）

如果第一个操作数的值为 truthy，则整个表达式的结果就是这个 truthy 的值，并且不会计算第二个操作数。

如果第一个操作数的值为 falsy，则整个表达式的结果就是第二个操作数的值。

console.log(true || "hello");   // 输出：true  
console.log(false || "hello");  // 输出："hello"  
console.log(0 || "hello");      // 输出："hello"  
console.log("" || "world");     // 输出："world"

注意：

Falsy（假值）是在布尔上下文中被当作false的值。这些值包括：false、0（数字零）、""（空字符串）、null、undefined、NaN（非数字），在逻辑运算或条件判断中，这些值都会被当作false来处理。

Truthy（真值）是在布尔上下文中被当作true的值。除了上述的falsy值之外，JavaScript中的所有其他值都是truthy的。这包括：所有对象（包括数组和函数）、所有非零数字（包括无穷大Infinity和-Infinity）、所有非空字符串、true，在逻辑运算或条件判断中，这些值都会被当作true来处理。

使用场景

这种“短路”行为（即如果第一个操作数已经决定了整个表达式的值，则不会计算第二个操作数）在JavaScript中非常有用，特别是在为变量赋值时。例如，你可以使用 || 运算符来提供一个默认值：

let name = userInput || "admi"; // 如果userInput是falsy，则name将被设置为"admi"

同样，你也可以使用 && 运算符来确保一个变量在访问其属性或方法之前已经定义：

let result = obj && obj.method(); // 如果obj是falsy，则result将被设置为obj的值（即falsy），否则result将是obj.method()的返回值

总结

• 逻辑与（&&）:
  • 如果第一个操作数为假，返回第一个操作数（短路）。
  • 如果第一个操作数为真，返回第二个操作数（评估第二个操作数）。
• 逻辑或（||）:
  • 如果第一个操作数为真，返回第一个操作数（短路）。
  • 如果第一个操作数为假，返回第二个操作数（评估第二个操作数）。