布尔值

Mr.Hope ... 2019-09-15 JavaScript
  • 快速上手
大约 3 分钟

布尔值代表“真”和“假”两个状态。“真”用关键字 true 表示,“假”用关键字 false 表示。布尔值只有这两个值。

下列运算符会返回布尔值:

  • 前置逻辑运算符: ! (Not)
  • 相等运算符: ===!====!=
  • 比较运算符: >>=<<=

如果 JavaScript 预期某个位置应该是布尔值,会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为 false,其他值都视为 true

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""''(空字符串)

布尔值往往用于程序流程的控制,请看一个例子。

if ("") {
  console.log("true");
}
// 没有任何输出
1
2
3
4

上面代码中,if 命令后面的判断条件,预期应该是一个布尔值,所以 JavaScript 自动将空字符串,转为布尔值 false,导致程序不会进入代码块,所以没有任何输出。

注意

注意,空数组([])和空对象({})对应的布尔值,都是 true

if ([]) {
  console.log("true");
}
// true

if ({}) {
  console.log("true");
}
// true
1
2
3
4
5
6
7
8
9

# 比较运算符

当我们对 Number 做比较时,可以通过比较运算符得到一个布尔值:

2 > 5; // false
5 >= 2; // true
7 == 7; // true
1
2
3

实际上,JavaScript 允许对任意数据类型做比较:

false == 0; // true
false === 0; // false
1
2

要特别注意相等运算符 ==。JavaScript 在设计时,有两种比较运算符:

  • 第一种是 == 比较,它会自动转换数据类型再比较,很多时候,会得到非常诡异的结果;

  • 第二种是 === 比较,它不会自动转换数据类型,如果数据类型不一致,返回 false,如果一致,再比较。

注意

由于 JavaScript 这个设计缺陷,不要使用 == 比较,始终坚持使用 === 比较。

另一个例外是 NaN 这个特殊的 Number 与所有其他值都不相等,包括它自己:

NaN === NaN; // false
1

唯一能判断 NaN 的方法是通过 isNaN() 函数:

isNaN(NaN); // true
1

最后要注意浮点数的相等比较:

1 / 3 === 1 - 2 / 3; // false
1

这不是 JavaScript 的设计缺陷。浮点数在运算过程中会产生误差,因为计算机无法精确表示无限循环小数。要比较两个浮点数是否相等,只能计算它们之差的绝对值,看是否小于某个阈值:

Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true
1

# 布尔运算符

# 与运算符 &&

&& 运算是与运算,从左至右运行时,检测到有任一表达式为 false 时,即停止执行输出该表达式的值,否则输出最后一个表达式的值。

也就是所只有所有表达式都为“真”时, && 才会输出真值。

true && true; // 这个&&语句计算结果为true
true && false; // 这个&&语句计算结果为false
false && true && false; // 这个&&语句计算结果为false
1
2
3

# 或运算符 ||

|| 运算是或运算,从左至右运行时,检测到有任一表达式为 true 时,即停止执行输出该表达式的值,否则输出最后一个表达式的值。

也就是所只有所有表达式都为“假”时, || 才会输出假值。

false || false; // 这个||语句计算结果为false
true || false; // 这个||语句计算结果为true
false || true || false; // 这个||语句计算结果为true
1
2
3

# 非运算符 !

! 运算是非运算,它是一个单目运算符,把 true 变成falsefalse 变成 true:

提示

! 会等待其后的表达式运算完毕,之后将其转换为 Boolean 后给出一个相反的值。

!true; // 结果为false
!false; // 结果为true
!(2 > 5); // 结果为true
1
2
3

布尔值经常用在条件判断中,比如:

let age = 15;

if (age >= 18) alert("adult");
else alert("teenager");
1
2
3
4

# 三元运算符

详见 条件判断 → 三元运算符 章节