0

JavaScript 逻辑运算符

 1 year ago
source link: https://www.myfreax.com/javascript-logical-operators/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
JavaScript 逻辑运算符

JavaScript 逻辑运算符

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

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

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

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

  • !(逻辑非)
  • || (逻辑或)
  • &&(逻辑与)

逻辑非运算符!

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

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

let eligible = false,
    required = true;

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

在此示例中,eligibletrue 所以 !eligible 返回 false。而既然 requiredtrue!required 则返回是 false

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

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

!a

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

  • 如果aundefined,结果是 true
  • 如果 anull,结果是 true
  • 如果 a0 以外的数字,则结果为 false
  • 如果 aNaN,结果是 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。如果 countertrue,则 ! 运算符将其设为false,反之亦然。

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

逻辑与运算符 &&

JavaScript 使用双符号 && 来表示逻辑与运算符。以下表达式使用 && 运算符:

let result = a && b;

如果 a 可以转换为 true,则 && 运算符返回 b;否则,它返回 a。事实上,这条规则适用于所有的布尔值。

以下真值表说明了 && 运算符应用于两个布尔值时的结果:

aba && b
truetruetrue
truefalsefalse
falsetruefalse
falsefalsefalse

&& 只有当两个值都为 true 时,运算符的结果才为真,否则为 false。例如:

let eligible = false,
    required = true;

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

在这个例子中, eligiblefalse,因此,表达式的值 eligible && requiredfalse

请参阅以下示例:

let eligible = true,
    required = true;

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

在本例中,eligiblerequired 都 是true,因此表达式的 eligible && required 值为 true

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

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

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

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

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

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

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

let result = value1 && value2 && value3;

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

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

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

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

逻辑或运算符 ||

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

let result = a || b;

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

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

aba || b
truetruetrue
truefalsetrue
falsetruetrue
falsefalsefalse

如果两个值的计算结果都为 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 淘宝打赏

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK