章节索引 :

JavaScript 逻辑运算符

逻辑运算符通常用于布尔型(逻辑)值。这种情况下,它们返回一个布尔值。然而,&& 和 || 运算符会返回一个指定操作数的值,因此,这些运算符也用于非布尔值。这时,它们也就会返回一个非布尔型值。—— MDN

逻辑运算符用于逻辑运算。如变量 num 要大于2同时也要小于 7,这里的同时就是一种逻辑运算。

JavaScript 中的逻辑运算有三种:

  • && 与 (并且)
  • || 或 (或者)
  • ! 非 (取反)

1. 与

语法:

表达式1 && 表达式2

如果表达式1的结果成立则返回表达式2的结果,否则返回表达式1的结果

与可以理解为且、并且、同时。与在 JavaScript 使用 && 表示。

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

与操作在左侧的表达式结果为 true 或者可以隐式转换为true的时候,会返回右侧表达式结果,否则返回左侧表达式结果。

如:判断成绩是否处于 80 到 100 之间。

80 到 100 之间换一种表述方式就是,成绩大于等于 80 并且成绩小于等于100,这种表述形式更像程序语言,所以条件就是分数 >= 80 并且 分数 <= 100

var score= 67;

if (score >= 80 && score <= 100) {
  console.log(score + '分在80到100之间');
} else {
  console.log(score + '分不在80到100之间');
}

if 语句中的条件左右都不满足,所以返回了表达式 score >= 80 的结果false。

如果 score 为 90,则满足两个条件,返回右侧表达式的结果。

2. 或

语法:

表达式1 || 表达式2

如果表达式1结果成立,则返回表达式 1 的结果,否则返回表达式 2 的结果

或就是或者。在 JavaScript 中使用 || 表示。

或操作符在当有表达式的结果为 true 或者可以隐式转换为 true 的时候,就返回这个表达式的结果,如果没有则返回右侧表达式的结果。

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

如:判断一个数能被 3 整除或者能被 5 整除。

能被 3 或者 5 整除的数,表述成类似于计算机语言的样子就是某个数 % 3 === 0 或者 某个数 % 5 === 0

var number = 15;

if (number % 3 === 0 || number % 5 === 0) {
  console.log(number + '可以被3或5整除');
} else {
  console.log(number + '不可以被3或5整除');
}

// 输出:15可以被3或5整除

3. 非

语法:

!表达式

非就是取反。表达式结果如果是布尔值,则会直接取反,结果如果不是布尔值,则会转换成布尔值再取反。

取反即将 true 变成 false,或者将 false 变成 true

!true; // false
!false; // true

!0; // true
!''; // true

!1; // false

不仅在日常编码中很常用到非,在许多代码压缩工作中也会用到非,如将 true 压缩成 !0,false 压缩成 !1,从 4 个字符和 5 个字符压缩到 2 个字符。

4. 双重非

双重非就是使用两个非,通常用于将一种数据类型转换成布尔值。

!!1; // true

首先 !1 会得到结果 false,再通过 !false 就会得到结果 true

5. 短路逻辑

短路逻辑是一种逻辑运算符的求值策略,还可以称作短路求值最小化求值

JavaScript 在进行与或计算的时候就会用到短路逻辑。

如:判断一个数是 2 的倍数同时又是 5 的倍数。

var number = 7;

number % 2 === 0 && number % 5 === 0;

number 不满足任意一个条件,&& 操作符碰到不成立的表达式就会直接返回这个表达式。

显然 number % 2 === 0 就不成立,所以直接返回这个表达式的结果,这样一个逻辑运算就已经得出结果了,JavaScript 不会再计算右侧的表达式。

这就是短路逻辑,只要得出了结果,就不会再继续计算

6. 小结

JavaScript 中有与&&、或||、非!三种逻辑运算符,用于处理值之间的逻辑关系,当需要多个条件的相互关系来决定结果的时候,就会用到逻辑运算符。

前置知识
什么是JavaScript 开发与学习环境准备 调试方案
基础
JavaScript 变量 JavaScript 数据类型 JavaScript if 语句 JavaScript for 语句 JavaScript 算数运算符 JavaScript 比较运算符 JavaScript 逻辑运算符 JavaScript 表达式 JavaScript 函数 JavaScript 对象 JavaScript 字符串 JavaScript 数字 JavaScript 数组 JavaScript switch 语句 JavaScript while 语句 JavaScript break与continue JavaScript with document.cookie
内置对象
JavaScript Function JavaScript Math JavaScript Date JavaScript RegExp JavaScript JSON
JavaScript 与 DOM
什么是DOM DOM和JavaScript的关系 获取和操作 DOM 节点 JavaScript DOM与事件 JavaScript DOM 事件绑定 JavaScript DOM 事件对象 JavaScript DOM 事件流 JavaScript DOM 事件优化 JavaScript DOM 自定义事件
表单处理
使用 JavaScript 校验表单
BOM
BOM window 对象 常用的 BOM 相关对象 BOM 常用属性和方法
AJAX
JavaScript AJAX
进阶知识
JavaScript 异常处理 JavaScript 三元运算符 JavaScript 逗号操作符 JavaScript void JavaScript typeof JavaScript delete JavaScript debugger JavaScript getter &setter JavaScript 原型 JavaScript new操作符和构造函数 JavaScript instanceof JavaScript this JavaScript 严格模式 JavaScript 作用域 JavaScript 闭包 JavaScript 变量提升 JavaScript 对象包装器
常用库
jQuery Lodash moment.js swiper
进阶指南
ECMAScript6 Node.js Babel CSS 预处理器 代码规范 TypeScript Web Components 小程序 Vue / React / Angular JavaScript 关键字
常见疑点与误区
分号问题 对象属性访问问题 this 使用问题 浮点数精度问题 独一无二的 NaN 避免全局污染 控制台观察对象问题 根据环境选择语言特性
扩展
相关资源