视频地址:https://www.bilibili.com/video/BV1Y7411K7zz?p=1

一直以来都没弄清楚js中的逻辑运算符是怎么回事 , 一直都以为他们的用法和java一样 , 今天才发觉以前的认知是错误的。因为js中不光可以处理false或true类型的,同时返回的值也不一定是true或false,他们的结果可以是任意类型。

Js中的逻辑运算符

JavaScript中有三个逻辑运算符,&&与、||或、!非,虽然他们被称为逻辑运算符,但这些运算符却可以被应用于任意类型的值而不仅仅是布尔值,他们的结果也同样可以是任意类型。

描述

如果一个值可以被转换为true,那么这个值就是所谓的truthy,如果可以被转换为false,那么这个值就是所谓的falsy。会被转换为false的表达式有: null、NaN、0、空字符串、undefined。

尽管&&和||运算符能够使用非布尔值的操作数,但它们依然可以被看作是布尔操作符,因为它们的返回值总是能够被转换为布尔值,如果要显式地将它们的返回值或者表达式转换为布尔值,可以使用双重非运算符即!!或者Boolean构造函数。

  • &&: AND,逻辑与,expr1 && expr2,若expr1可转换为true则返回expr2,否则返回expr1。
  • ||: OR,逻辑或,expr1 || expr2,若expr1可转换为true则返回expr1,否则返回expr2。
  • !: NOT,逻辑非,!expr,若expr可转换为true则返回false,否则返回true。

短路计算

由于逻辑表达式的运算顺序是从左到右,是适用于短路计算的规则的,短路意味着下面表达式中的expr部分不会被执行,因此expr的任何副作用都不会生效。造成这种现象的原因是,整个表达式的值在第一个操作数被计算后已经确定了。

  • (some falsy expression) && (expr)短路计算的结果为假。
  • (some truthy expression) || (expr)短路计算的结果为真。

强制转换类型

使用双重非运算符能够显式地将任意值强制转换为其对应的布尔值,这种转换是基于被转换值的truthyness和falsyness的。

console.log(!!true);                   // true
console.log(!!{}); // true // 任何对象都是truthy的
console.log(!!(new Boolean(false))); // true // 此为对象而不是字面量
console.log(!!false); // false
console.log(!!""); // false
console.log(!!Boolean(false)); // false // 调用构造函数生成字面量

演示示例

/* javascript中除了以下这些之外,其余都为真:
* 0、""、null、false、undefined、NaN
*/ //逻辑与(&&)算法:
//如果第一个为true , 则返回第二个值
//如果第一个为false, 则返回false
alert('=============================&&=============================');
alert(true && false); //-->false
alert(false && true); //-->false
alert(true && 'aaa'); //-->aaa
alert('aaa' && true); //-->true
alert(false && 'aaa'); //-->false
alert('aaa' && false); //-->false
alert('aaa' && 'bbb'); //-->bbb
alert(null && 'aaa'); //-->null
alert('aaa' && undefined); //-->''
alert('aaa' && ''); //-->''
alert('aaa' && NaN); //-->NaN //逻辑或(||)算法:
//如果第一个为true , 则true
//如果第一个为false, 则返回第二个值
alert('=============================||=============================');
alert(true || false); //-->true
alert(false || true); //-->true
alert(true || 'aaa'); //-->true
alert('aaa' || true); //-->aaa
alert(false || 'aaa'); //-->aaa
alert('aaa' || false); //-->aaa
alert('aaa' || 'bbb'); //-->aaa
alert(null || 'aaa'); //-->aaa
alert('aaa' || undefined); //aaa
alert('aaa' || ''); //-->aaa
alert('aaa' || NaN); //-->aaa //逻辑非( ! )算法:
//将值转换为boolean值,类似于parseBoolean()操作(注意:说的是类似哦,事实上js并没有parseBoolean方法哈)
alert('=============================!=============================');
alert(! 'aaa'); //-->false
alert(!! 'aaa'); //-->true
alert(! NaN); //-->true
alert(!! ''); //-->false

最新文章

  1. 【Android自学日记】【转】Android Fragment 真正的完全解析(上)
  2. nginx.conf配置文件里的upstream加入健康检查
  3. 修复HTTP 503错误
  4. Codeforces Round #371 (Div. 2) C. Sonya and Queries[Map|二进制]
  5. Response、Request、QueryString,repeater添加,修改,删除数据
  6. ios uiview封装动画(摘录)
  7. 关于项目中用到的流程的sql和表
  8. Thinking in life(1)
  9. android ipc通信机制之二序列化接口和Binder
  10. Windows版 mysql 5.7.16安装
  11. UVA - 12627 Erratic Expansion 奇怪的气球膨胀 (分治)
  12. [Leetcode][Python]36: Valid Sudoku
  13. Linux常用操作
  14. FTP-使用记录
  15. rsyslog和logrotate
  16. Mysql数据库基础小实例 学员管理系统菜单
  17. Java基础知识(JAVA基本数据类型包装类)
  18. 【Net Core】DNX概述
  19. HDU_1548
  20. Alamofire请求网络

热门文章

  1. 转 linux终端 字符界面 显示乱码 .
  2. 接口的不同写法在Swagger上的不同
  3. #1使用html+css+js制作网站教程 准备
  4. php 去除路由中index.php 通过 .htaccess 文件
  5. Docker-Compose练习
  6. 上班从换一张桌面壁纸开始——开源小工具Bing每日壁纸
  7. Java基础-数据类型及变量
  8. 工具用的好,下班回家早!5分钟玩转iTerm2!
  9. 【SpringMVC】SpringMVC 入门
  10. nginx: [emerg] bind() to 0.0.0.0:80 failed (10013: