你肯定见到过这样的代码:a = a||"xxx".

它其实就等价于下面三种形式的代码:

a = a || "xxx";

与:

if (!a) {
a = "xxx";
}

和:

if (a == null || a == "" || a == undefined) {
a = "xxx";
}

如何理解三种代码。首先必须理解一个问题: javascript 中的数据类型在与bool类型转换时候发生了什么?

javascript中,数据类型可以分为 “真值” 和 “假值”。也就是说,真值转换为bool类型时,为true; 假值转换为bool类型时,为false。下列为了一些常见的数据类型转为bool类型时的值:

数据类型 转换为bool后的值
null FALSE
undefined FALSE
Object TRUE
function TRUE
0 FALSE
1 TRUE
0、1之外的数字 TRUE
字符串 TRUE
""(空字符串) FALSE

在 if表达式中,javascript 首先将条件表达式转换为bool类型,表达式为真值则执行 if 中的逻辑, 否则跳过。

那么,再来看看 “&&” 和 “||” 这两个javascript 表达式。 javascript 是若类型预言,所以在javascript中这两个表达式可能跟其他语言中不太一样。

&& 的运算法则如下:

如果 && 左侧表达式的值为真值,则返回右侧表达式的值;否则返回左侧表达式的值。

也就是说:

var i = "" && "真值"; // -> i = "";
i = "真值" && "其他真值"; // -> i = "其他真值"
i = "真值" && ""; // -> i = ""

|| 的运算法则如下:

如果|| 左侧表达式的值为真值,则返回左侧表达式的值;否则返回右侧表达式的值。

var i = "" || "真值"; // -> i = "真值";
i = "真值" || "其他真值"; // -> i = "真值"
i = "真值" || ""; // -> i = "真值"

这样也就可以理解 a = a || "xxx"; 的逻辑了:如果 a 为假值 (等于null, 空字符串 "" ....),则 "xxx" 赋给 a; 否则,将 a 的值赋给 a 本身.

下面举例应用,运用 || 和 && 来简化程序:

var parameter="";
function test(parameter){
//return 真值
return true;
} //真值操作
function operate1(parameter){
return "真值操作";
} //假值操作
function operate2(parameter){
return "假值操作";
} var result=test(parameter)&&operate1(parameter);
result=test(parameter)||operate2(parameter); //等价于
result=test(parameter)?operate1(parameter):operate2(parameter); alert(result); //真值操作 //也等价于
if(test(parameter)){
result=operate1(parameter);
}else{
result=operate2(parameter);
} alert(result) //真值操作

JACK

@@ 12/11/2014 NJ USA

  

JavaScript - javascript 中的 "||" 与 "&&" 的理解与灵活运的更多相关文章

  1. 图说js中的this——深入理解javascript中this指针

    没搞错吧!js写了那么多年,this还是会搞错!没搞错,javascript就是回搞错! ………… 文章来源自——周陆军的个人网站:http://zhoulujun.cn/zhoulujun/html ...

  2. 对于JavaScript中this关键字的理解

    这是我第二遍学this了,第一遍学的懵懵的.this指哪里都是凭我一个男人的直觉然后控制台输出看看对不对. 刚查了书.博客.视频.理解差不多了.毕竟菜鸡me: 一.首先介绍下什么是this this是 ...

  3. javascript学习中自己对作用域和作用域链理解

    在javascript学习中作用域和作用域链还是相对难理解些,下面我关于javascript作用域和作用域链做一下详细介绍,给各位初学者答疑解惑. 首先我们介绍一下什么是作用域?  从字面上理解就是起 ...

  4. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  5. JavaScript "自"运行-setInertval()和setTimeout()理解

    setInterval()和clearInterval() var result = "Y"; function onOk() { var tid = setInterval(fu ...

  6. Javascript Jquery 中的数组定义与操作_子木玲_新浪博客

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  7. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

  8. javascript编写一个简单的编译器(理解抽象语法树AST)

    javascript编写一个简单的编译器(理解抽象语法树AST) 编译器 是一种接收一段代码,然后把它转成一些其他一种机制.我们现在来做一个在一张纸上画出一条线,那么我们画出一条线需要定义的条件如下: ...

  9. JavaScript 原型中的哲学思想

    学习JavaScript过程中,原型问题一直让我疑惑许久,那时候捧着那本著名的红皮书,看到有关原型的讲解时,总是心存疑虑.当在JavaScript世界中走过不少旅程之后,再次萌发起研究这部分知识的欲望 ...

随机推荐

  1. 带你看懂Dictionary的内部实现

    了解Dictionary的开发人员都了解,和List相比,字典添加会慢,但是查找会比较快,那么Dictionary是如何实现的呢? Dictionary的构造 下面的代码我看看Dictionary在构 ...

  2. ASP.NET 5系列教程 (二):Hello World

    本篇文章内容比较基础,主要是向大家展示如何创建一个 ASP.NET 5 工程,主要包含内容如下: 创建ASP.NET 5 工程 添加 Todo 控制器 安装 K Version Manager 执行 ...

  3. Mac直播服务器Nginx配置对HLS的支持

    在上一篇中Mac上搭建直播服务器Nginx+rtmp,我们已经搭建了nginx+rtmp直播服务器.下面需要对Nginx服务器增加对HLS的支持.在Nginx增加对HLS种支持比较简单,只是简单的修改 ...

  4. webApp 阅读器项目实践

    这是一个webApp 阅读器的项目,是慕课网的老师讲授的一个实战,先给出项目源码在GitHub的地址:https://github.com/yulifromchina/MobileWebReader. ...

  5. HTTP协议之chunk编码(分块传输编码

    Transfer-Encoding: chunked 表示输出的内容长度不能确定,普通的静态页面.图片之类的基本上都用不到这个. 但动态页面就有可能会用到,但我也注意到大部分asp,php,asp.n ...

  6. Atitit.可视化编程jbpm6 的环境and 使用总结...

    Atitit.可视化编程jbpm6 的环境and 使用总结... 1. Jbpm的意义 1 2. Jbpm6环境配置 2 2.1. Down 2 2.2. Install eclipse jbpm p ...

  7. atitit.添加win 系统服务 bat批处理程序服务的法总结instsrv srvany java linux

    atitit.添加win 系统服务 bat批处理程序服务的法总结instsrv srvany  java linux 系统服务不同于普通视窗系统应用程式.不可能简简单单地通过运行一个EXE就启动视窗系 ...

  8. paip.复制文件 文件操作 api的设计uapi java python php 最佳实践

    paip.复制文件 文件操作 api的设计uapi java python php 最佳实践 =====uapi   copy() =====java的无,要自己写... ====php   copy ...

  9. 连接数据库——模拟ATM机查、存、取、开户功能

    1.界面:包含开户.查询.存款.取款.功能 package com.bank.test; /** * * @author Administrator *界面类 */ public class Jiem ...

  10. java继承8个题

    1.实现如下类之间的继承关系,并编写Music类来测试这些类. public class Instrument { public void play(){ System.out.println(&qu ...