JavaScript 逻辑运算符

在本教程中，您将学习如何使用 JavaScript 逻辑运算符，包括逻辑 非 运算符 !、逻辑 与 运算符 && 和逻辑 或 运算符 ||。

逻辑运算符在 JavaScript 很重要，因为它们允许您比较变量并根据比较结果执行某些操作。

例如比较的结果是 true，就可以运行一段代码，如果是false，您可以执行另一个代码块。

JavaScript 提供了三种逻辑运算符：

• ！（逻辑非）
• || （逻辑或）
• &&（逻辑与）

逻辑非运算符！

JavaScript 使用感叹号 ! 来表示逻辑非运算符。 ! 运算符可以应用于任何类型的值，而不仅仅是布尔值。

当您将 ! 运算符应用于布尔值时，如果值是 true，则 ! 返回 false，反之亦然。例如：

let eligible = false,
    required = true;

console.log(!eligible);
console.log(!required);

true
false

在此示例中，eligible 是 true 所以 !eligible 返回 false。而既然 required 是true，!required 则返回是 false。

当您将 ! 运算符应用于非布尔值时。! 运算符首先将值转换为布尔值，然后取反。

以下示例显示了如何使用 ! 运算符：

!a

逻辑 ! 运算符基于以下规则工作：

• 如果a是 undefined，结果是 true。
• 如果 a 是 null，结果是 true。
• 如果 a 是 0 以外的数字，则结果为 false。
• 如果 a 是NaN，结果是 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 是 true，则 ! 运算符将其设为false，反之亦然。

第二个 ! 运算符否定第一个 ! 运算符的结果并返回 counter 变量的布尔值。

逻辑与运算符 &&

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 值为 true。

短路评估

&&接线员短路。这意味着 && 运算符仅在第一个值不足以确定表达式的值时才计算第二个值。例如：

let b = true;
let result = b && (1 / 0);
console.log(result);

Infinity

因此，在此示例中，b 是 true，如果不进一步评估第二个表达式 1/0 ，则运算符无法确定结果。

结果是表达式 1/0 的 Infinity。然而：

let b = false;
let result = b && (1 / 0);
console.log(result);

false

在这种情况下，b 是 false，&& 运算符不需要计算第二个表达式，因为它可以根据第一个值，将最终结果确定为 false 。

链式 &&

以下表达式使用多个 && 运算符：

let result = value1 && value2 && value3;

&&  运算符运行过程如下：

• 从左到右评估值。
• 对于每个值，将其转换为布尔值。如果结果为 false，则停止并返回原始值。
• 如果所有值都是 true，则返回最后一个值。

换句话说，&& 运算符返回第一个假值或最后一个值。

如果一个值可以转换为 true，它就是所谓的真值。如果一个值可以转换为 false，它就是所谓的伪值。

逻辑或运算符 ||

JavaScript 使用双管道 || 来表示逻辑或运算符。您可以将 | |运算符应用于任何类型的两个值：

let result = a || b;

如果 a 可以转换为 true，则返回 a；否则，返回 b。此规则也适用于布尔值。

下面表说明了 || 运算符的结果：

如果两个值的计算结果都为 false ，则 || 运算符返回 false。如果任一值为 true，则运算符 || 返回 true。例如：

let eligible = true,
    required = false;

console.log(eligible || required); // true

看另一个例子：

let eligible = false,
    required = false;

console.log(eligible || required); // false

在此示例中，表达式 eligible || required 返回 false，因为两个值都是 false。

短路评估 ||

与 && 运算符一样，|| 也会进行短路评估。这意味着如果第一个值的计算结果为true，则 || 运算符不会计算第二个值。

链式 ||

以下示例显示如何在表达式使用多个运算符 || ：

let result = value1 || value2 || value3;

|| 运算符执行以下操作：

• 从左到右评估值。
• 对于每个值，将其转换为布尔值。如果转换的结果是 true，则停止并返回值。
• 如果所有值都已评估为 false，则返回最后一个值。

换句话说，|| 运算符链返回第一个真值，如果没有找到真值，则返回最后一个。

逻辑运算符优先级

当您在表达式中混合使用逻辑运算符时，JavaScript 引擎会根据指定的顺序计算运算符。而这个顺序就叫做运算符优先级。

换句话说，运算符优先级是表达式中逻辑运算符的求值顺序。逻辑运算符的优先级从高到低依次为：

1. 逻辑非（！）
2. 逻辑与 (&&)
3. 逻辑或 (||)

结论

• 逻辑非运算符 !  布尔值取反。!! 将变量的值转换为布尔值。
• 逻辑与运算符 && 应用于两个布尔值，如果两个值都为真，则返回真。
• 逻辑或运算符 || 应用于两个布尔值，如果其中一个值是 true ，则返回true。
• && 和 || 运算符都可以进行短路评估。它们也可以应用于非布尔值。
• 逻辑运算符的优先级从高到低是 ! ， && 和 ||。

myfreax

微信公众号

支付宝打赏