英文 | https://www.javascripttutorial.net/
译文 | 杨小爱
在上节中，我们学习了JavaScript 比较运算符，错过的小伙伴可以点击文章《【JavaScript 教程】第三章运算符03— JavaScript 比较运算符》进行学习。
那么，在今天的教程中，我们将一起来学习如何使用 JavaScript 逻辑运算符，包括逻辑非运算符 ( !）、逻辑与运算符 ( &&) 和逻辑或运算符 ( ||）。
逻辑运算符在 JavaScript 中很重要，因为它们允许您比较变量并根据比较结果执行某些操作。
例如，如果比较的结果是true，则执行一段代码；如果是false，则执行另一个代码块。
JavaScript 提供了三种逻辑运算符：
- ！（逻辑非）
- || （逻辑或）
- &&（逻辑与）
1) 、逻辑非运算符 (!)
JavaScript 使用感叹号!来表示逻辑非运算符。逻辑非运算符(!)可被应用于任何类型的，而不是仅仅一个布尔值的一个值。
当您将逻辑非运算符(!)一个布尔值，则!返回true值是否false返回false如果如果值true。例如：
let eligible = false,
required = true;
console.log(!eligible);
console.log(!required);
输出：
true
false
在这个例子中，eligibleis trueso!eligible返回false。因为required是false，所以!required返回false。
当您将逻辑非运算符(!)应用于非布尔值时。逻辑非运算符(!)首先将值转换为一个布尔值，然后取消它。例如：
以下示例显示了如何使用逻辑非运算符(!)：
!a
逻辑非运算符(!)基于以下规则工作：
- 如果a是undefined，结果是true。
- 如果a是null，结果是true。
- 如果a是以外的数字0，则结果为false。
- 如果a是NaN，结果是true。
- 如果a是null，结果是true。
- 如果a是对象，则结果为false。
- 如果a是空字符串，则结果为true。如果a是非空字符串，则结果为false
下面演示了将逻辑非运算符(!)应用于非布尔值时的结果：
console.log(!undefined); // true
console.log(!null); // true
console.log(!20); //false
console.log(!0); //true
console.log(!NaN); //true
console.log(!{}); // false
console.log(!''); //true
console.log(!'OK'); //false
console.log(!false); //true
console.log(!true); //false
双重否定 ( !!)
有时，您可能会在代码中看到双重否定 ( !!)。在使用逻辑非运算符(!!)两次后的值将转换成其真正的布尔值。结果与使用Boolean()函数相同。例如：
let counter = 10;
console.log(!!counter); // true
第一个逻辑非运算符!返回counter变量的布尔值。第二个逻辑非运算符!否定该结果并返回counter变量的真实布尔值。
2) 逻辑与运算符 ( &&)
JavaScript 使用&&来表示逻辑与运算符。
以下表达式使用&&运算符：
let result = a && b;
如果a可以转换为true，则&&运算符返回b; 否则，它返回a。事实上，这条规则适用于布尔值。
以下真值表说明了将运算符&&应用于两个布尔值时的结果：
&&仅当两个值都为true时，运算符的结果才为真，否则为false。例如：
let eligible = false,
required = true;
console.log(eligible && required); // false
在此，示例中，eligible是false，因此，表达式的eligible && required值为false。
请参阅以下示例：
let eligible = true,
required = true;
console.log(eligible && required); // true
在此示例中，eligible和required都是true，因此，表达式的eligible && required值为false。
短路评估
该&&运营商短路。这意味着&&仅当第一个值不足以确定表达式的值时，运算符才会计算第二个值。例如：
let b = true;
let result = b && (1 / 0);
console.log(result);
输出：
Infinity
因此，在此示例中，bis运算符无法在不进一步评估第二个表达式 ( ) 的情况下确定结果。true&&1/0，结果是Infinity表达式 ( 1/0)的结果。然而：
let b = false;
let result = b && (1 / 0);
console.log(result);
输出：
false
在这种情况下，bis false，&&运算符不需要计算第二个表达式，因为它可以将最终结果确定false为第一个值的基础值。
&&运营商链
以下表达式使用多个&&运算符：
let result = value1 && value2 && value3;
该&& 运营商传送如下：
- 从左到右计算值。
- 对于每个值，将其转换为布尔值。如果结果为 false，则停止并返回原始值。
- 如果所有值都是真值，则返回最后一个值。
换句话说，&&如果没有找到，运算符返回第一个假值或最后一个值。
如果一个值可以转换为 true，它就是所谓的真值。如果一个值可以转换为 false，它就是所谓的假值。
3) 逻辑或运算符 ( ||）
JavaScript 使用双竖线||来表示逻辑 OR 运算符。您可以将逻辑或运算符||应用于任何类型的两个值：
let result = a || b;
如果 a 可以转换为 true，则返回 a；否则，返回 b。此规则也适用于布尔值。
下面的真值表说明了 基于逻辑或运算符||的运算结果：
如果运算符||两个值的计算结果都为 false，则运算符返回 false。如果运算符||的任一值为true ， 则返回true。例如：
let eligible = true,
required = false;
console.log(eligible || required); // true
以下表达式将运算符||应用于两个非布尔值：
在这个例子中，符合条件的 || required 返回 true，因为其中一个值为 true。看另一个例子：
let eligible = false,
required = false;
console.log(eligible || required); // false
在此示例中，表达式eligible || required返回false，因为两个值都是false。
运算符||也短路了
与&&运算符类似，运算符||是短路的。这意味着如果第一个值的计算结果为true，则&&运算符不会计算第二个值。
一串||运营商链
下面的例子展示了如何使用多个 || 表达式中的运算符：
let result = value1 || value2 || value3;
运算符||执行以下操作：
- 从左到右计算值。
- 对于每个值，将其转换为布尔值。如果转换结果为真，则停止并返回值。
- 如果所有值都被评估为 false，则返回最后一个值。
换句话说，运算符 || 的链如果未找到真值，运算符将返回第一个真值或最后一个真值。
逻辑运算符优先级
在表达式中使用混合逻辑运算符时，JavaScript 引擎会根据指定的顺序对运算符求值，此顺序称为运算符优先级。换句话说，运算符优先级是运算符执行的顺序。
逻辑运算符的优先级从高到低依次为：
- 逻辑非 (!)
- 逻辑与 (&&)
- 逻辑或 (||)
总结
- NOT 运算符 (!) 否定布尔值。(!!) 将一个值转换为其真正的布尔值。
- AND 运算符 (&&) 应用于两个布尔值，如果两个值都为真，则返回真。
- OR 运算符 (||) 应用于两个布尔值，如果操作数之一为真，则返回真。
- && 和 ||操作员短路。它们也可应用于非布尔值。
- 逻辑运算符的优先级从高到低依次为 !、&& 和 ||。
