文档章节

Javascript逻辑运算符“或”的应用

jndion2011
 jndion2011
发布于 2015/04/02 00:39
字数 972
阅读 366
收藏 20

在Javascript中,逻辑运算符主要用于布尔型的逻辑运算,可以根据表达式的运算结果返回一个布尔值。由于参数并不一定非得是true或者false(它们可以蕴涵真或者假的意义),因此返回的结果也可以不是一个布尔值。

要理解这个“或”(||)运算符的作用,我们先来看一个相对简单的例子。在下面这个例子中,或运算符可以被用来为一个新定义好的变量提供一个默认值:

<!-- lang: js -->
    var bar = false,
    foobar = 5,
    foo = bar || foobar; // foo = 5

在上面这个例子当中,只有当bar蕴涵假的时候,foobar才会将它自身的值传递给foo。在这里需要指出,包括0,false,undefined,null,NaN和空字符串""这些类型都是蕴涵假的。

如果你写过jQuery插件,或者使用过$.extend()方法,这种用法你可能会比较熟悉。你会发现这个方法常常被用于给一个options对象约定默认值,或者赋予确切值。

<!-- lang: js -->
function( options ) {
    options = $.extend({}, defaults, options || {});
}

一些开发人员喜欢特意使用或算符将蕴涵假的值统一转换为null。这样做的好处是可以确保这些值都是空。

<!-- lang: js -->
var foo = bar || null;

通常情况下,我们并不特意需要一个null值,不过当你确实需要的时候,这样做你就不需要纠结这个值究竟是不是你想要的值,或者这个值是不是必须得是null值。

你也会发现一些开发人员选择使用这种方法去初始化命名空间,不同于传统上使用 namespace = namespace || {} 先进行命名空间的初始化,然后再扩展这个命名空间,我们还可以直接一步到位:

<!-- lang: js -->
var namespace = namespace || {
    utils:{},
    core:{}
};

在这里我们简单介绍一下原理。由于Javascript的变量并不是有严格的类型的,所以一个通过布尔算符初始化的变量也可以被赋予一个数值值: <!-- lang: js --> console.log(null || NaN || undefined || false || 0 || 10); // outputs: 10

这里发生的事情并不是那么神奇,其实只是表达式偷了一下懒。解析器会先确认表达式的第一个语句,null,确定了这是一个蕴涵假的值,继续向下解析直到遇到一个不蕴涵假的值(或者如果一直没有遇到不蕴涵假的值,则返回最后一个值)。这是一个在包括Javascript在内的各种动态语言中经常使用的解析技巧。不过这种方法并不适用与静态语言,如果你在静态语言中这样做系统会直接抛出一个类型错误。

那么这究竟有什么用处呢?像我们之前看到的一样,如果一个变量有可能是空,那么或运算符可以在函数中用来提供一个默认值:

function foo( a, b ){
    a = a || 5;
    b = b || 6;
    console.log( 'Values:' + a + ',' +b );
}

当然,你也可以使用如下的方法来解决这个问题:

if(a && a === 5){
    // do something
}else{
    // do something else
}

为什么要这样写呢?我们可以从两个方面分析这个问题。首先是可读性,一些开发人员认为if/else语句的可读性更强,那么在心里解读这一段代码不需要花较多的时间去理解。我认为如果只是从喜好角度考虑的话,我们用if/else语句完全可以达到相同的效果。其次是性能问题,开发人员普遍认为if语句要比||算符性能更佳,不过通过测试发现它们之间的表现力并没有非常大的区别。

© 著作权归作者所有

共有 人打赏支持
jndion2011
粉丝 2
博文 12
码字总数 8228
作品 0
淮南
程序员
私信 提问
加载中

评论(1)

山哥
山哥
应该还有且的运算:a && (doSomething)
JavaScript 编程精解 中文第三版 一、值,类型和运算符

一、值,类型和运算符 原文:Values, Types, and Operators 译者:飞龙 协议:CC BY-NC-SA 4.0 自豪地采用谷歌翻译 部分参考了《JavaScript 编程精解(第 2 版)》 在机器的表面之下,程序在...

apachecn_飞龙
04/29
0
0
javascript “||”、“&&”的灵活运用

你是否看到过这样的代码:a=a||""; 可能javascript初学者会对此感到茫然。今天就跟大家分享一下我的一些心得。 其实: a=a||"defaultValue";与: if(!a){a="defaultValue";}和: if(a==null...

i33
2012/11/06
0
0
第5章—JavaScript运算符

5.1运算符类型:①算术运算符②赋值运算符③比较运算符④逻辑运算符⑤位运算符⑥特殊运算符 5.2算术运算符:+,-,*,/,%,++,--,+(一元加),-(一元减) 5.2.1(+):①强制类型转换(低精度向高...

湖心亭看雪
2014/10/24
0
0
理解JavaScript的原始类型

JavaScript中的原始类型(primitive type)包括Undefined、Null、Number、Boolean和String,其他变量均为引用类型,也就是Object Type。原始类型保存位置是“栈内存”,而引用类型保存在“堆...

董广明
2014/02/20
0
0
理解JavaScript的原始类型

JavaScript中的原始类型(primitive type)包括Undefined、Null、Number、Boolean和String,其他变量均为引用类型,也就是Object Type。原始类型保存位置是“栈内存”,而引用类型保存在“堆...

con
2014/02/17
0
11

没有更多内容

加载失败,请刷新页面

加载更多

在Flutter中嵌入Native组件的解决方案

摘要: 引言 在漫长的从Native向Flutter过渡的混合工程时期,要想平滑地过渡,在Flutter中使用Native中较为完善的控件会是一个很好的选择。本文希望向大家介绍AndroidView的使用方式以及在此...

阿里云官方博客
40分钟前
1
0
aws S3 util demo

package com.example.demo;import com.amazonaws.AmazonClientException;import com.amazonaws.AmazonServiceException;import com.amazonaws.auth.BasicAWSCredentials;import co......

经常把天聊死的胖子
今天
4
0
linux下查看cpu、memo、io、swap性能数据脚本

直接贴脚本: 1、cpu #!/bin/bashCurrentDate=`date -d today '+%Y%m%d'`CurrentTime=`date -d today '+%Y%m%d%H%M'`mytext="$CurrentTime\t`top -b -n 1 | grep Cpu\(s\......

郑加威
今天
5
0
MySQL之——查询重复记录、删除重复记录方法大全

MySQL之——查询重复记录、删除重复记录方法大全

安小乐
今天
2
0
spring容器启动,停止,关闭事件监听-ApplicationEvent

ApplicationEvent ApplicationEvent相当于一个事件,所有自定义事件都需要继承这个抽象类。在Eclipse中Ctrl+Shift+H调用类的层次结构列表,可以看到如下 Application下抽象子类ApplicationCo...

tantexian
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部