一文读懂JavaScript逻辑运算符

在JavaScript中,逻辑运算符用于根据多个条件评估某件事是真还是假。

这一次,我们将讨论逻辑运算符的类型、如何使用它们以及示例。

逻辑运算符

逻辑运算符是用于处理真伪值(true和false)的运算符,它表示以下三种类型。

运算符 示例 说明
逻辑与(&&) expr1 && expr2 (逻辑与) 如果 expr1 能被转换为 false,那么返回 expr1;否则,返回expr2。因此,&&用于布尔值时,当操作数都为 true 时返回 true;否则返回 false.
逻辑或(||) expr1 || expr2 (逻辑或) 如果 expr1 能被转换为 true,那么返回 expr1;否则,返回expr2。因此,|| 用于布尔值时,当任何一个操作数为 true 则返回 true;如果操作数都是 false 则返回 false。
逻辑非(!) !expr (逻辑非) 如果操作数能够转换为 true 则返回 false;否则返回 true。

虽然逻辑运算符描述为处理真伪值,但操作数不必总是为true或false,它可以是任何类型的操作数,例如数字或字符串。

如果操作数不是真伪值,则根据规则将其转换为true或false以进行求值。

一文读懂JavaScript逻辑运算符

使用逻辑运算符

从这里开始,让我们看看如何按类型使用逻辑运算符。

AND运算符(&&)

如果前面和后面的操作数都为真,则 AND 运算符返回真,否则返回假。

操作数 && 操作数
console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false

请参阅下面的评估结果。

let num = 5;

// true && true 
console.log(num > 2 && num === 5); // true

// true && false
console.log(num > 2 && num === 6); // false

在内部是这样运行的。

  • num>2为true,num===5为true→整体结果为true

  • num>2为true,num===6为false→整体结果为false

如果操作数不是布尔值,则会将其转换为 true 或 false 并进行计算。

AND运算符用于检查是否满足if语句中给出的所有条件。

let age = 7;
let height = 130;

if (age > 6 && height > 128) { // true && true 
  console.log('满足乘坐过山车的条件。');
}

// "满足乘坐过山车的条件。"

OR运算符(||)

如果其前面或后面的操作数中至少有一个为真,则 OR 运算符返回true,否则返回false。

操作数 || 操作数
console.log(true || true); // true
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false

除非两个操作数都为假,否则结果始终为真。

let num = 5;

// true && true
console.log(num > 2 || num === 5); // true

// true && false
console.log(num > 2 || num === 6); // true

// false && false
console.log(num > 6 || num === 6); // false

OR运算符用于检查是否满足if语句中给出的任何条件。

let scoreA = 80;
let scoreB = 65;

if (scoreA >= 80 || scoreB >= 70) { // true || false 
  console.log('测试通过')
}

// "测试通过"

NOT运算符 (!)

NOT运算符如果操作数为真,则返回false;如果操作数为假,则返回true。

这意味着返回操作数评估结果的反向真伪值。

!操作数
console.log(!true); // false
console.log(!false); // true

在下面的示例中,num > 10的评估false是 。

NOT 运算符返回其反转结果,因此整体结果为真。

let num = 5;

console.log(!(num > 10)); // true

NOT 运算符在您想要否定给定条件时使用,例如在 if 语句中。

let snacks = false;

if (!snacks) {
  console.log('工作时间内禁止吃零食');
}

// "工作时间内禁止吃零食"

值为假

如果你使用布尔值或者做一些数值计算,你可以想象它的计算结果是真还是假。

但如果不是,你应该知道以下关于什么值是真或假的规则。

//规则

  • 假值为false

  • 非假值为true

假值是以下七类值。

  • false

  • null

  • undefined

  • 0

  • 0n

  • NaN

  • “”(空字符)

最好先只记住错误的值,然后知道其他一切都为真。

短路求值

作为逻辑表达式进行求值是从左到右,如果前面的操作数为假,则AND运算符不会计算后面的操作数。

true && console.log('这个控制台被运行'); // "这个控制台被运行"

// 因为前面的操作数是假的、不计算后面的操作数
false && console.log('这个控制台不会被运行');

AND运算符要求其所有操作数都为真,因此当前一个操作数的计算结果为假时,我们知道结果为假。

此外,如果前面的操作数为真,则OR运算符不会计算后面的操作数。

false || console.log('这个控制台被运行'); // "这个控制台被运行"

// 因为前面的操作数是假的,、不计算后面的操作数
true || console.log('这个控制台不会被运行');

OR运算符只需要它的一个操作数为真,所以我们知道当前一个操作数的计算结果为真时,结果将为真。

这样,当该值确定后,不再进行进一步的计算,称为短路求值。

如果我们看一下短路求值算法,就更容易理解了。

AND运算符查找第一个假值

AND运算符按以下顺序工作:

value1 && value2;

按从前到后的顺序计算操作数

将每个操作数转换为布尔值

如果前一个操作数的计算结果为 false,则在该点停止计算并返回该操作数

如果评估所有操作数(全部为真),则返回最后一个操作数

// 如果前面的操作数为假,则返回该操作数,忽略后面的操作数
console.log(null && '后面的操作数'); // null
console.log(0 && '后面的操作数'); // 0

// //如果前面的操作数为真,返回后面的操作数
console.log(1 && '后面的操作数'); // "后面的操作数"
console.log('1' && '后面的操作数'); // "后面的操作数"

OR运算符查找第一个真值

OR 运算符按以下顺序工作:

value1 || value2;

按从前到后的顺序计算操作数

将每个操作数转换为布尔值

如果前一个操作数的计算结果为真,则在该点停止计算并返回该操作数

如果评估所有操作数(全部为假),则返回最后一个操作数

// 如果前面的操作数为真,则返回该操作数,忽略后面的操作数
console.log(100 || '后面的操作数'); // 100
console.log('hello' || '后面的操作数'); // "hello"

// 如果前面的操作数为假,则返回后面的操作数
console.log("" || '后面的操作数'); // "后面的操作数"
console.log(undefined || '后面的操作数'); // "后面的操作数"

结语

现在,我们来谈谈逻辑运算符。

//要点

  • 逻辑运算符是处理真假值的运算符

  • 不需要记住所有的真假值,最好能理解被认为是假的值。

  • 在确定值的时候不再进行计算,这叫做短路求值。

逻辑运算符也经常与运算符(如比较运算符)一起使用。

试验其他运算符,看看哪些值是真或假。