1. JavaScript 基础

  2. 深入数据和类型

  3. 函数进阶

  4. 运算符

  5. 浏览器存储

  6. Document

  7. Web API

  8. 事件

  9. 工具与规范

  10. 实例

  11. 练习

JavaScript 中有四种逻辑运行符, &&(与)、 ||(或)、 !(非)、 ?? (空值合并)。初步的介绍与使用在逻辑运算符章节有,这个章节讲解一下深入用法。

与运算符

&& 表示与运算符。简单地理解,必须所有操作数都为真值,才返回 true,存在一个操作数为假值则返回 false

false && false // false
true && false // false
true && true // true
true && true && false // false

与运行符经常用来判断条件同时成立

$$jsdemo$$
$$edit$$
const hour = Number(prompt("请输入当前小时:"))

if (hour >= 9 && hour <= 17) {
    // 如果当前时间晚于 9 点, 早于 17 点, 说明是上班时间
    alert("现在是上班时间。")
} else {
    alert("现在是下班时间。")
}

返回第一个假值

实际上,&& 运算符的运算规则是,**从左至右进行运算,返回遇到的第一个假值的操作数,否则返回最后一个操作数。**关于运算数是真值还是假值可以查看真值与假值部分

因此我们可以用这个原理返回运算数中第一个假值或最后一个值。

0 && null // 0
true && {} && undefined // undefined
true && NaN && 0 // NaN
1 && 2 && 3 && 4 // 4,最后一个值

或运算符

|| 表示或运算符。简单地理解,只要有一个操作数为真值,则返回 true,全为假值才返回 false

false || false // false
true || false // true
true || true // true
false || false || true // true

或运行符经常用来判断条件部分成立

$$jsdemo$$
$$edit$$
const hour = Number(prompt("请输入当前小时:"))

if (hour < 9 || hour > 17) {
    // 如果当前时间早于 9 点, 晚于 17 点, 说明是下班时间
    alert("现在是下班时间。")
} else {
    alert("现在是上班时间。")
}

返回第一个真值

实际上,&& 运算符的运算规则是,**从左至右进行运算,返回遇到的第一个真值的操作数,否则返回最后一个操作数。**关于运算数是真值还是假值可以查看真值与假值部分

0 || null // null
false || {} || undefined // {}
false || NaN || 0 // 0,最后一个值
0 || 1 || 2 || 3 // 1

利用这个特性,可以把我们的代码写得更优雅更简单,以下两段代码是等价的。

$$jsdemo$$
$$edit$$
let username = prompt("请输入用户名:")
if (username === "") {
    username = "默认用户名"
}
alert("你的用户名是:" + username)
$$jsdemo$$
$$edit$$
const username = prompt('请输入用户名:') || '默认用户名'
alert("你的用户名是:" + username)

非运算符

! 表示非运算符,它会进行以下操作。

  1. 将操作数转成布尔类型。
  2. 返回相反的布尔值。
!true // false
!false // true
!0 // true
!1 // false
!{} // false
!undefined // true

真值与假值

在 JavaScript 中,所有转为 Boolean 类型后为 true 的值都被称为真值,为 false 类型的值都被称为假值。

以下为真值:

  • 非 0 的数字
  • 非空的字符串
  • 数组
  • 对象

以下为假值:

  • 0
  • 空字符串
  • null
  • undefined
  • NaN
Boolean(10) // true
Boolean(-5) // true
Boolean('hello') // true
Boolean({}) // true
Boolean(new Date()) // true

Boolean(0) // false
Boolean('') // false
Boolean(null) // false
Boolean(undefined) // false
Boolean(NaN) // false