在本教程中,您将学习如何使用 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
。事实上,这条规则适用于所有的布尔值。
以下真值表说明了 &&
运算符应用于两个布尔值时的结果:
a | b | a && b |
---|---|---|
true | true | true |
true | false | false |
false | true | false |
false | false | false |
&&
只有当两个值都为 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
。此规则也适用于布尔值。
下面表说明了 ||
运算符的结果:
a | b | a || b |
---|---|---|
true | true | true |
true | false | true |
false | true | true |
false | false | false |
如果两个值的计算结果都为 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 引擎会根据指定的顺序计算运算符。而这个顺序就叫做运算符优先级。
换句话说,运算符优先级是表达式中逻辑运算符的求值顺序。逻辑运算符的优先级从高到低依次为:
- 逻辑非(!)
- 逻辑与 (&&)
- 逻辑或 (||)
结论
- 逻辑非运算符
!
布尔值取反。!!
将变量的值转换为布尔值。 - 逻辑与运算符
&&
应用于两个布尔值,如果两个值都为真,则返回真。 - 逻辑或运算符
||
应用于两个布尔值,如果其中一个值是true
,则返回true
。 &&
和||
运算符都可以进行短路评估。它们也可以应用于非布尔值。- 逻辑运算符的优先级从高到低是
!
,&&
和||
。