你肯定见到过这样的代码: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. [ACM_搜索] POJ 1096 Space Station Shielding (搜索 + 洪泛算法Flood_Fill)

    Description Roger Wilco is in charge of the design of a low orbiting space station for the planet Ma ...

  2. 微软Dynamics 使用葡萄城的Wijmo 5提供移动端用户界面

    近日,全球最大的控件提供商葡萄城公司宣布: 葡萄城近日与微软公司达成合作,将Wijmo 产品线的HTML5和JaveScript 控件融合到微软Dynamics CRMOnline 2016版中. 随 ...

  3. GPU---并行计算利器

    转载请引用:GPU---并行计算利器 源于阿里巴巴CCO<猿来如此>分享 1 GPU是什么 如图1所示,这台PC机与普通PC机不同的是这里插了7张显卡,左下角是显卡,在中间的就是GPU芯片 ...

  4. Cacti学习笔记一:基本安装和配置

    1.安装依赖包 yum -y install net-snmp-devel mysql mysql-devel openssl-devel libtool 2.安装RRDTool yum -y ins ...

  5. jQuery实现左移右移

    <html> <head> <meta charset="utf-8"> <title>完成左移右移</title> & ...

  6. mysql输入密码后闪退怎么办?

    第一: 首先需要想到的是mysql的服务可能没开,首先打开mysql的服务 第二: 打开Mysql的命令行输入密码即可 第三: 登录成功 第四: 顺便验证自己安装的mysql是否成功 输入显示所有数据 ...

  7. 分析一个C语言程序生成的汇编代码-《Linux内核分析》Week1作业

    署名信息 郭春阳 原创作品转载请注明出处 :<Linux内核分析>MOOC课程 http://mooc.study.163.com/course/USTC-1000029000 C源码 这 ...

  8. javascript基础08

    发现今天居然没有要写,那我就写写之前做的笔记吧. 这是事件的深入: 拖拽逻辑: 第一个: onmousedown : 选择元素 第二个: onmousemove : 移动元素 第三个:onmouseu ...

  9. 改善C#公共程序类库质量的10种方法

    最近重构一套代码,运用以下几种方法,供参考. 1  公共方法尽可能的使用缓存 public static List<string> GetRegisteredCompany() { Str ...

  10. Flv.js

    Flv.js 是 HTML5 Flash 视频(FLV)播放器,纯原生 JavaScript 开发,没有用到 Flash.由 bilibili 网站开源. 该项目依托于 Media Source Ex ...