全面解析JavaScript中“&&”和“||”操作符(总结篇)
作者:小平果118 发布时间:2024-04-10 16:16:28
1、||(逻辑或),
从字面上来说,只有前后都是false的时候才返回false,否则返回true。
alert(true||false); // true
alert(false||true); // true
alert(true||true); // true
alert(false||false); // false
这个傻子都知道~~
但是,从深层意义上来说的话,却有另一番天地,试下面代码
alert(0||1);//1
显然,我们知道,前面0意味着false,而后面1意味着true,那么上面的结果应该是true,而事实返回的结果是1。再看下面代码:
alert(2||1);//2
我们知道,前面2是true,后面1也是true,那返回结果又是什么呢?测试结果是2,继续看:
alert('a'||1);//'a'
同样,前面'a'是true,后面1也是true;测试结果是'a',下面
alert(''||1);//1
由上,我们知道前面”是false,后面1是true,而返回结果是1。再看下面
alert('a'||0);//'a'
前面'a'是true,而后面0是false,返回结果是'a',继续下面
alert(''||0);//0
前面”是false,后面0同样是false,返回结果是0
alert(0||'');//''
前面0是false,后面”是false,返回结果是”
这就意味
1、只要“||”前面为false,不管“||”后面是true还是false,都返回“||”后面的值。
2、只要“||”前面为true,不管“||”后面是true还是false,都返回“||”前面的值。
我称这种为短路原理: 知道了前面第一个的结果就知道后的输出,如果为第一个为:true,则取第一个的值,如果第一个为false,则取第二个的值。
js必须牢记的6个蛋蛋: 请你一定要记住:在js逻辑运算中,0、”“、null、false、undefined、NaN都会判为false,其他都为true(好像没有遗漏了吧,请各位确认下)。这个一定要记住,不然应用||和&&就会出现问题。
这里顺便提下:经常有人问我,看到很多代码if(!!attr),为什么不直接写if(attr);
其实这是一种更严谨的写法:
请测试 typeof 5和typeof !!5的区别。!!的作用是把一个其他类型的变量转成的bool类型。
2.&&(逻辑与)
从字面上来说,只有前后都是true的时候才返回true,否则返回false。
alert(true&&false); // false
alert(true&&true); // true
alert(false&&false); // false
alert(false&&true); // false
然后,根据上面经验,我们看看“&&”号前后,不单单是布尔类型的情况。
alert(''&&1);//''
结是返回”,“&&”前面”是false,后面是1是true。
alert(''&&0);//''
结是返回”,“&&”前面”是false,后面是0也是false。
alert('a'&&1);//1
结是返回1,“&&”前面”a是true,后面是1也是true。
alert('a'&&0);//0
结是返回0,“&&”前面”a是true,后面是0是false。
alert('a'&&'');//''
结是返回”,“&&”前面”a是true,后面是”是false。
alert(0&&'a');//0
结是返回0,“&&”前面”0是false,后面是'a'是true。
alert(0&&''); //0
结是返回0,“&&”前面”0是false,后面是”也是false。
短路原理
1、只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;
2、只要“&&”前面是true,无论“&&”后面是true还是false,结果都将返“&&”后面的值;
3.在开发中的应用
下面三段代码等价:
a=a||"defaultValue";
if(!a){
a="defaultValue";
}
if(a==null||a==""||a==undefined){
a="defaultValue";
}
你愿意用哪一个呢?
2、 像var Yahoo = Yahoo || {};这种是非常广泛应用的。 获得初值的方式是不是很优雅?比if。。。。else…好很多,比?:也好不少。
3、 callback&&callback()
在回调中,经常这么写,更严谨,先判断 callback 是不是存在,如果存在就执行,这样写的目的是为了防止报错
如果直接写 callback(); 当callback不存在时代码就会报错。
4、综合实例
需求如图:
这里写图片描述
假设对成长速度显示规定如下:
成长速度为5显示1个箭头;
成长速度为10显示2个箭头;
成长速度为12显示3个箭头;
成长速度为15显示4个箭头;
其他都显示都显示0各箭头。
用代码怎么实现?
差一点的if,else:
var add_level = 0;
if(add_step == 5){
add_level = 1;
}
else if(add_step == 10){
add_level = 2;
}
else if(add_step == 12){
add_level = 3;
}
else if(add_step == 15){
add_level = 4;
}
else {
add_level = 0;
}
稍好些的switch:
var add_level = 0;
switch(add_step){
case 5 : add_level = 1;
break;
case 10 : add_level = 2;
break;
case 12 : add_level = 3;
break;
case 15 : add_level = 4;
break;
default : add_level = 0;
break;
}
如果需求改成:
成长速度为>12显示4个箭头;
成长速度为>10显示3个箭头;
成长速度为>5显示2个箭头;
成长速度为>0显示1个箭头;
成长速度为<=0显示0个箭头。
那么用switch实现起来也很麻烦了。
那么你有没有想过用一行就代码实现呢?
ok,让我们来看看js强大的表现力吧:
var add_level = (add_step==5 && 1) || (add_step==10 && 2) || (add_step==12 && 3) || (add_step==15 && 4) || 0;
更强大的,也更优的:
var add_level={'5':1,'10':2,'12':3,'15':4}[add_step] || 0;
第二个需求:
var add_level = (add_step>12 && 4) || (add_step>10 && 3) || (add_step>5 && 2) || (add_step>0 && 1) || 0;
以上所述是小编给大家介绍的全面解析JavaScript中“&&”和“||”操作符(总结篇)网站的支持!
来源:http://blog.csdn.net/i10630226/article/details/51938340
猜你喜欢
- 代码如下:<% myDSN="DSN=xur;uid=xur;pwd=xur"mySQL="s
- 用Python实现常规的静态网页抓取时,往往是用urllib2来获取整个HTML页面,然后从HTML文件中逐字查找对应的关键字。如下所示:i
- *****看一下我定义的change()和run()函数******绘图坐标体系:作用:设置主窗体的大小和位置turtle.setup(wi
- 一、一站式解决 1. 问题分析定位# 找到MySQL的配置文件,复制mysql的数据目录vim /etc/my.cnf# 进入ms
- 协同过滤在 用户 —— 物品(user - item)的数据关系下很容易收集到一些偏好信息(preference),比如评分。利用这些分散的
- Python序列化的概念很简单。内存里面有一个数据结构,你希望将它保存下来,重用,或者发送给其他人。你会怎么做?这取决于你想要怎么保存,怎么
- 在照着Tensorflow官网的demo敲了一遍分类器项目的代码后,运行倒是成功了,结果也不错。但是最终还是要训练自己的数据,所以尝试准备加
- 一、切换到Oracle用户su – oracle二、登录到sys用户sqlplus / as sysdba三、创建临时表空间//查询临时表空
- 本文实例讲述了MySQL 的启动和连接方式。分享给大家供大家参考,具体如下:MySQL运行包括两部分,一部分是服务器端程序mysqld,另外
- 今天偶尔在一个学习网站技术的地方看到一个教程,关于html代码的,刚看到咱常用到的视频播放器html标签Object,平时用到他的时候都是为
- 在SQL Server数据库中如何查看一个登录名(login)的具体权限呢,如果使用SSMS的UI界面查看登录名的具体权限的话,用户数据库非
- SQL Server 获取数据的总记录数,有两种方式:1.先分页获取数据,然后再查询一遍数据库获取到总数量2.使用count(1) over
- 1. 背景最近在爬取某个站点时,发现在POST数据时,使用的数据格式是request payload,有别于之前常见的 POST数据格式(F
- 本文实例讲述了Python编程中event对象的用法。分享给大家供大家参考,具体如下:Python提供了Event对象用于线程间通信,它是由
- 如下所示:def trans_data_to_pair(self,data,index): contents=[
- delete 删除一张大表时空间不释放,非常慢是因为占用大量的系统资源,支持回退操作,空间还被这张表占用着。truncate table 表
- 我就废话不多说了,直接上代码吧!from numpy import *import numpy as npimport cv2, os, m
- 本文实例讲述了python实现web方式logview的方法。分享给大家供大家参考。具体如下:这里用Python实现web方式查看日志的一个
- WordPress默认登录页面:http://192.168.0.120/wordpress/wp-login.php 1、Chrome浏览
- 本文实例讲述了Python事务操作实现方法。分享给大家供大家参考,具体如下:#coding=utf-8import sysimport My