Javascript表达式中连续的 && 和 || 之赋值区别


Posted in Javascript onOctober 17, 2010

代码如下:

function write(msg){ 
for(var i = 0; i < arguments.length; i ++){ 
document.write(arguments[i] + '<br />'); 
} 
} 
//关于 '&&' 
test1 = 1 && 2 && 3 && 4; 
test2 = '0' && 2 && 3 && 4; 
test3 = 1 && 2 && 0 && 4; 
test4 = 2 && 'i' && 'love' && 3 && 'you'; 
test5 = 'i' && 'hate' && 1 && 0 && 'you'; 
test6 = 1 && false && 'ihateyou' && '2'; 
test7 = 2 && true && 'ihatehateyou' && '23'; 
test8 = 4 && true && 'undefined' && 'true' && '1'; 
test9 = 4 && true && undefined && 'true' && '1'; 
test10 = 4 && true && 'null' && 'true' && '1'; 
test11 = 4 && true && null && 'true' && '1'; 
write(test1, test2, test3, test4, test5, test6, test7, test8, test9, test10, test11); 
write('----------------------------------------------'); 
//关于 '||' 
_test1 = 1 || 2 || 3 || 4; 
_test2 = 0 || 2 || 3 || 4; 
_test3 = 0 || '0' || 8 || 4; 
_test4 = 2 || 'i' || 'love' || 0 || 'you'; 
_test5 = 0 || 'hate' || 1 || 0 || 'you'; 
_test6 = false || 0 || 'ihateyou' || '2'; 
_test7 = false || true || 'ihatehateyou' || '23'; 
_test8 = 0 || 0 || 'undefined' || 'true' || '1'; 
_test9 = 0 || 0|| undefined || 'true' || '1'; 
_test10 = 0 || false || 'null' || 'true' || '1'; 
_test11 = 0 || 0 || null || 'true' || '1'; 
write(_test1, _test2, _test3, _test4, _test5, _test6, _test7, _test8, _test9, _test10, _test11);

来看看输出结果就会明白了:

关于 ‘&&'的输出结果为:

4 
4 
0 
you 
0 
false 
23 
1 
undefined 
1 
null

每一行的编号对应上面的每一个 test。

关于 ‘||'的输出结果为:

1 
2 
0 
2 
hate 
ihateyou 
true 
undefined 
true 
null 
true

仔细对照着看的话就会清楚一些了:

多个连续的 && 的表达式中若没有 0, false, undefined, null 的话,它将取得最后一个“子表达式”的值,否则将表达式中的 0, false, undefined, null 返回。

多个连续的 || 的表达式将会取第一个“子表达式”的值,若为 0, false, undefined, null 中之一的话则取下一个“子表达式”的值,以此类推,直至找到不为 0, false, undefined, null 的“子表达式”,并将它作为整个表达式的值。

补充:

上面的似乎没有考虑一种情况,就是有一个子表达式为 '' 怎么办呢?其实可以再换一种表述方式来描述 && 和 || 的工作方式:

对于 (...) && (...) && (...) ...

从左至右遍历各个子表达式,并将每个子表达式进行 Boolean 的强制转换,若出现 Boolean(子表达式) 为 false 的情况,则整个表达式的值即为此子表达式的值(0 或 false 或 undefined 或 null 或 ''),后面的子表达式不再判断;若所有的 Boolean(子表达式) 均为 true,则整个表达式的值即为最后一个子表达式的值。

对于 (...) || (...) || (...) ...

从左至右遍历各个子表达式,并将每个子表达式进行 Boolean 的强制转换,若出现 Boolean(子表达式) 为 true 的情况,则整个表达式的值即为此子表达式的值,后面的子表达式不再“理会”;若 Boolean(子表达式) 为 false,则判断后一个子表达式的 Boolean 情况,直至找到 Boolean(子表达式) 为 true 的情况;若全部的 Boolean(子表达式) 均为 false,则返回最后一个子表达式的值(0 或 false 或 undefined 或 null 或 '')。

这里要注意:

Boolean(false) != Boolean('false'),前者为 false,而后者为 true 。

Boolean(undefined) != Boolean('undefined'),前者为 false,而后者为 true 。

Boolean(null) != Boolean('null'),前者为 false,而后者为 true 。

Boolean(0) != Boolean('0'),前者为 false,而后者为 true 。

Boolean('') == false

Javascript 相关文章推荐
javascript检查日期格式的函数[比较全]
Oct 17 Javascript
jQuery ajaxForm()的应用
Oct 14 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
May 17 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
Aug 03 Javascript
js中比较两个对象是否相同的方法示例
Sep 02 Javascript
layui插件表单验证提交触发提交的例子
Sep 09 Javascript
解决Vue在Tomcat8下部署页面不加载的问题
Nov 12 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
Nov 20 Javascript
JavaScript代码异常监控实现过程详解
Feb 17 Javascript
ng-alain的sf如何自定义部件的流程
Jun 12 Javascript
jquery实现广告上下滚动效果
Mar 04 jQuery
JS中forEach()、map()、every()、some()和filter()的用法
May 11 Javascript
Javascript读取cookie函数代码
Oct 16 #Javascript
JavaScript 拾碎[三] 使用className属性
Oct 16 #Javascript
javascript使用eval或者new Function进行语法检查
Oct 16 #Javascript
自己整理的一个javascript日期处理函数
Oct 16 #Javascript
理解Javascript_10_对象模型
Oct 16 #Javascript
理解Javascript_09_Function与Object
Oct 16 #Javascript
理解Javascript_08_函数对象
Oct 15 #Javascript
You might like
PHP将回调函数作用到给定数组单元的方法
2014/08/19 PHP
PHP中抽象类和抽象方法概念与用法分析
2016/05/24 PHP
Django中通过定时任务触发页面静态化的处理方式
2018/08/29 PHP
幻宇的层模拟窗口效果-提供演示和下载
2007/01/20 Javascript
禁止F5等快捷键的JS代码
2007/03/06 Javascript
JavaScript Distilled 基础知识与函数
2010/04/07 Javascript
Javascript将string类型转换int类型
2010/12/09 Javascript
jQuery EasyUI API 中文文档 - NumberSpinner数值微调器使用介绍
2011/10/21 Javascript
禁用Enter键表单自动提交实现代码
2014/05/22 Javascript
举例简介AngularJS的内部语言环境
2015/06/17 Javascript
学习JavaScript设计模式之单例模式
2016/01/19 Javascript
微信小程序 数据封装,参数传值等经验分享
2017/01/09 Javascript
HTML5+jQuery实现搜索智能匹配功能
2017/03/24 jQuery
基于vue中解决v-for使用报红并出现警告的问题
2018/03/03 Javascript
详解Vue.js自定义tipOnce指令用法实例
2018/12/19 Javascript
vue将后台数据时间戳转换成日期格式
2019/07/31 Javascript
js实现微信聊天界面
2020/08/09 Javascript
解决vux 中popup 组件Mask 遮罩在最上层的问题
2020/11/03 Javascript
python自动发送测试报告邮件功能的实现
2019/01/22 Python
Python操作redis实例小结【String、Hash、List、Set等】
2019/05/16 Python
Python异常处理例题整理
2019/07/07 Python
Python帮你微信头像任意添加装饰别再@微信官方了
2019/09/25 Python
使用NumPy读取MNIST数据的实现代码示例
2019/11/20 Python
Pyecharts地图显示不完成问题解决方案
2020/05/11 Python
Python3创建Django项目的几种方法(3种)
2020/06/03 Python
关于python的缩进规则的知识点详解
2020/06/22 Python
Python Matplotlib简易教程(小白教程)
2020/07/28 Python
python 利用matplotlib在3D空间中绘制平面的案例
2021/02/06 Python
使用JS+CSS3技术:让你的名字动起来
2013/04/27 HTML / CSS
瑞士国际航空官网:SWISS
2016/07/21 全球购物
Nike台湾官方商店:Nike.com (TW)
2017/08/16 全球购物
锐步英国官网:Reebok英国
2019/11/29 全球购物
mysql_pconnect()和mysql_connect()有什么区别
2012/05/25 面试题
ktv收银员岗位职责
2013/12/16 职场文书
单位消防安全制度
2014/01/12 职场文书
Python合并多张图片成PDF
2021/06/09 Python