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 相关文章推荐
JavaScript网页定位详解
Jan 13 Javascript
js实现图片在未加载完成前显示加载中字样
Sep 03 Javascript
JavaScript根据CSS的Media Queries来判断浏览设备的方法
May 10 Javascript
JavaScript中点击事件的写法
Jun 28 Javascript
vuejs2.0实现分页组件使用$emit进行事件监听数据传递的方法
Feb 22 Javascript
Angular2 组件通信的实例代码
Jun 23 Javascript
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
Aug 07 Javascript
使用express搭建一个简单的查询服务器的方法
Feb 09 Javascript
微信小程序用户拒绝授权的处理方法详解
Sep 20 Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
Oct 22 Javascript
js实现有趣的倒计时效果
Jan 19 Javascript
Vue+Flask实现图片传输功能
Apr 01 Vue.js
利用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
用php来检测proxy
2006/10/09 PHP
PHPMailer邮件发送的实现代码
2013/05/04 PHP
php中通过DirectoryIterator删除整个目录的方法
2015/03/13 PHP
PHP利用hash冲突漏洞进行DDoS攻击的方法分析
2015/03/26 PHP
用javascript实现的仿Flash广告图片轮换效果
2007/04/24 Javascript
Javascript Select操作大集合
2009/05/26 Javascript
form表单只提交数据而不进行页面跳转的解决方案
2013/09/18 Javascript
js 针对html DOM元素操作等经验累积
2014/03/11 Javascript
jquery 隐藏与显示tr标签示例代码
2014/06/06 Javascript
Javascript中的方法和匿名方法实例详解
2015/06/13 Javascript
使用Promise解决多层异步调用的简单学习心得
2016/05/17 Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
2016/05/20 Javascript
AngularJs bootstrap搭载前台框架——js控制部分
2016/09/01 Javascript
jQuery在ie6下无法设置select选中的解决方法详解
2016/09/20 Javascript
详解Vue2.X的路由管理记录之 钩子函数(切割流水线)
2017/05/02 Javascript
探究react-native 源码的图片缓存问题
2017/08/24 Javascript
Angularjs 根据一个select的值去设置另一个select的值方法
2018/08/13 Javascript
微信小程序内拖动图片实现移动、放大、旋转的方法
2018/09/04 Javascript
新手如何快速理解js异步编程
2019/06/24 Javascript
Vue $emit()不能触发父组件方法的原因及解决
2020/07/28 Javascript
jQuery编写QQ简易聊天框
2020/08/27 jQuery
[26:50]2018完美盛典DOTA2表演赛
2018/12/17 DOTA
wxpython学习笔记(推荐查看)
2014/06/09 Python
Python使用metaclass实现Singleton模式的方法
2015/05/05 Python
Python中matplotlib中文乱码解决办法
2017/05/12 Python
python将处理好的图像保存到指定目录下的方法
2019/01/10 Python
Pyqt5实现英文学习词典
2019/06/24 Python
Django 再谈一谈json序列化
2020/03/16 Python
Python变量及数据类型用法原理汇总
2020/08/06 Python
Origins悦木之源香港官网:雅诗兰黛集团高端植物护肤品牌
2018/03/21 全球购物
美德好少年主要事迹
2014/01/29 职场文书
2014年节能降耗工作总结
2014/12/11 职场文书
2014年药品销售工作总结
2014/12/16 职场文书
护士医德考评自我评价
2015/03/03 职场文书
idea 在springboot中使用lombok插件的方法
2021/08/02 Java/Android
python神经网络Xception模型
2022/05/06 Python