js中bool值的转换及“&&”、“||”、 “!!”详解


Posted in Javascript onDecember 21, 2017

前言

首先需要知道的是,js中有6个值为false,分别是: 0, '', null, undefined, NaN 和 false, 其他(包括{}, [], Infinity)为true.

可以使用Boolean()函数或是两次取非就能获得对象的布尔值,例如Boolean(undefined)和!!undefined同样能取得布尔值false,

对于0, '', null, undefined, NaN,{}, [], Infinity求布尔值,分别是false false false false false true true true.

因此我们知道的一点是:对象的布尔值是true,即使是对象{}。

bool值转换

数据类型 bool值转化
undefined undefined 转化为 false
Object null 转化为false,其他为 true
Boolean false 转化为 false,true 转化为 true
Number 0,NaN 转化为false,其他为 true
String "" 转化为 false,其他为 true

"&&"

javascript中“&&”运算符运算法则如下:

如果&&左侧表达式的值为真值,则返回右侧表达式的值;否则返回左侧表达式的值。多个&&表达式一起运算时,返回第一个表达式运算为false的值,如果所有表达式运算结果都为true,则返回最右侧一个表达式运算的值。

const aa = {'name': 'xx'};
const bb = aa && aa.age; // bb输出为undefined;
let cc;
const dd = cc && cc.name ? cc.name : undefined; // dd输出为undefined
const dd = cc && cc.name; // dd输出为undefined;

上面两句代码的执行结果是一样的,之前写代码的时候一直用上面的方式,但是发现有些单测覆盖不到,导致单测分支覆盖率很低,换下面的方式就可以很好的解决这个问题,这两句的效果是一样的。

"||"

javascript中"||"运算符的运算法则如下:

如果"||"左侧表达式的值为真值,则返回左侧表达式的值;否则返回右侧表达式的值。多个"||"表达式一起运算时,返回第一个表达式运算结果为true的值,如果所有表达式运算结果都为false,否则返回最右侧的表达式的值。

const aa = false || 'xx'; // aa输出为'xx'

"!!"

"!!"将表达式进行强制转化为bool值的运算,运算结果为true或者false。

const aa = 'xx';
const bb = !!aa; // bb输出为true
const cc = !!(NaN || undefined || null || 0 || '' ); // cc为false;

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
jQuery 技巧小结
Apr 02 Javascript
javaScript NameSpace 简单说明介绍
Jul 18 Javascript
详细介绍8款超实用JavaScript框架
Oct 25 Javascript
js实现a标签超链接提交form表单的方法
Jun 24 Javascript
原生JavaScript制作微博发布面板效果
Mar 11 Javascript
jQuery中$.ajax()方法参数解析
Oct 22 Javascript
jquery实现下拉框左右选择功能
Feb 21 Javascript
详解webpack+vue-cli项目打包技巧
Jun 17 Javascript
代码整洁之道(重构)
Oct 25 Javascript
vue 更改连接后台的api示例
Nov 11 Javascript
解决ant-design-vue中menu菜单无法默认展开的问题
Oct 31 Javascript
Handtrack.js库实现实时监测手部运动(推荐)
Feb 08 Javascript
利用node实现一个批量重命名文件的函数
Dec 21 #Javascript
详解webpack3编译兼容IE8的正确姿势
Dec 21 #Javascript
利用vue开发一个所谓的数独方法实例
Dec 21 #Javascript
开发Vue树形组件的示例代码
Dec 21 #Javascript
详解使用vuex进行菜单管理
Dec 21 #Javascript
Angular5.1新功能分享
Dec 21 #Javascript
vue2中的keep-alive使用总结及注意事项
Dec 21 #Javascript
You might like
fleaphp rolesNameField bug解决方法
2011/04/23 PHP
php的array_multisort()使用方法介绍
2012/05/16 PHP
PHP操作Redis数据库常用方法示例
2018/08/25 PHP
读jQuery之八 包装事件对象
2011/06/21 Javascript
浅谈JavaScript事件的属性列表
2015/03/01 Javascript
javascript中JSON对象与JSON字符串相互转换实例
2015/07/11 Javascript
jquery实现手机号码选号的方法
2015/07/31 Javascript
jQuery EasyUI 组件加上“清除”功能实例详解
2017/04/11 jQuery
AngularJS基于provider实现全局变量的读取和赋值方法
2017/06/28 Javascript
vue2过滤器模糊查询方法
2018/09/16 Javascript
vue 实现小程序或商品秒杀倒计时
2019/04/14 Javascript
vue柱状进度条图像的完美实现方案
2019/08/26 Javascript
使用React-Router实现前端路由鉴权的示例代码
2020/07/26 Javascript
[00:36]DOTA2上海特级锦标赛 Archon战队宣传片
2016/03/04 DOTA
python之wxPython菜单使用详解
2014/09/28 Python
快速实现基于Python的微信聊天机器人示例代码
2017/03/03 Python
django进阶之cookie和session的使用示例
2018/08/17 Python
Python SQL查询并生成json文件操作示例
2018/08/17 Python
Python实现的ftp服务器功能详解【附源码下载】
2019/06/26 Python
在Pytorch中使用样本权重(sample_weight)的正确方法
2019/08/17 Python
Python 合并多个TXT文件并统计词频的实现
2019/08/23 Python
使用Django搭建web服务器的例子(最最正确的方式)
2019/08/29 Python
python无序链表删除重复项的方法
2020/01/17 Python
Tensorflow 多线程与多进程数据加载实例
2020/02/05 Python
Django rest framework分页接口实现原理解析
2020/08/21 Python
移动端解决悬浮层(悬浮header、footer)会遮挡住内容的3种方法
2015/03/27 HTML / CSS
英超联赛的首选足球:Mitre足球
2019/05/06 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
什么叫应用程序域?什么是托管代码?什么是强类型系统?什么是装箱和拆箱?什么是重载?CTS、CLS和CLR分别作何解释?
2012/05/23 面试题
学校司机岗位职责
2013/11/14 职场文书
服装机修工岗位职责
2013/12/26 职场文书
丽江古城导游词
2015/02/03 职场文书
倡议书范文大全
2015/04/28 职场文书
教务处干事工作总结
2015/08/14 职场文书
干货:如何写好工作总结报告!
2019/05/10 职场文书
Oracle数据库事务的开启与结束详解
2022/06/25 Oracle