[Javascript] “||”和“&&”的灵活运用

引用URL : http://my249645546.iteye.com/blog/1553202

你是否看到过这样的代码:a=a||""; 可能javascript初学者会对此感到茫然。今天就跟大家分享一下我的一些心得。

其实:

a=a||"defaultValue";

与:

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

和:

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

是等价的!

为了弄清这个问题,首先我们必须了解一个问题: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中的逻辑,否则跳过。

于是有了:

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

下面我们再来看“&&”、“||”两个表达式。

由于javascript是弱类型语言,所以在javascript中这两个表达式可能跟其他语言(比如java)中不太一样。

在javascript中,“&&”运算符运算法则如下:

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

这就是说:

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

“||”运算符的运算法则如下:

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

这就是说:

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

于是,就可以理解:

a=a||"defaultValue";

的逻辑了。如果a为假值(等于null、空字符串……),则将"defaultValue"赋给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)//真值操作

时间: 2024-10-13 18:34:26

[Javascript] “||”和“&&”的灵活运用的相关文章

javascript “||”、“&&”的灵活运用

主要介绍了||和 &&的作用 1.|| 和Java中不一样 代表的是 如果左边的true就返回左边 否则返回右边 2.&& 和java中不一样 代表的是 如果左边返回的true就返回右边 否则返回左边

1javascript语法

javascript是Navigator2.0中的关键组件之一,javascript是解释型的,以对象为基础的,易于使用与学习且紧紧集成与html的语言.javascript将当前浏览器会话的属性提供给了编程者,这些属性包括当前加载的html页面的元素,如窗体.框架以及链接.javascript是区分大小写. java与javascript之间存在着差别,虽然它们是相关的,javascript借用了java大多数的语法,但他们在本质上是不同的而且服务于不同的目的,可以说java与javascri

JavaScript知识总结<一>

JavaScript核心基础语法: 1.什么是JavaScript? 我们知道在Web标准中网页由:结构.形式.行为三部分组成:结构由标准形式XHTML.形式又标准形式CSS,那么行为的表现就由JavaScript来表示,即行为的标准语言. 所以我们大概就知道了JavaScript是干什么用的了——是一种专门用来给网页增加交互性的编程语言,其代码通常嵌入在网页中.虽然与java名字相差不多,其实他们两种语言没有什么关系,知识借用了java的名字来吸引度而已.它是一门解释性语言,就意味着它不需要经

如何理解并学习javascript中的面向对象(OOP) [转]

如果你想让你的javascript代码变得更加优美,性能更加卓越.或者,你想像jQuery的作者一样,写出属于自己优秀的类库(哪怕是基于 jquery的插件).那么,你请务必要学习javascript面向对象,否则你无法更灵活的使用javascript这门语言. 什么事闭包?到底什么是原型?(知道闭包和原型的,就算得上是javascript的高手了.但真正能够理解,并且灵活运用的人并不多)到底该如何学习javascript中的面向对象呢?在javascript这么语言正如日中天,相信不少人正在为

asp.net或javascript判断是否手机访问

 Welcome to CSU Online Judge! 1112: 机器人的指令 Time Limit: 1 Sec  Memory Limit: 128 MB Submit: 274  Solved: 97 [Submit][Status][Web Board] Description 数轴原点有一个机器人.该机器人将执行一系列指令,你的任务是预测所有指令执行完毕之后它的位置. ·LEFT:往左移动一个单位 ·RIGHT: 往右移动一个单位 ·SAME AS i: 和第i 条执行相同的

【前端】javascript中10常用的个小技巧总结

javascript中10常用的个小技巧总结 本文转自:http://www.cnblogs.com/libin-1/p/6756393.html 1. new Set() 可能有人知道ES6中提供了新的数据结构 Set,但是能够灵活运用的人或许不多.利用Set数据结构我们能够轻松的去重一个数组,比如: let arr = [1, 2, 2, 3]; let set = new Set(arr); let newArr = Array.from(set); // Array.from方法可以将

JavaScript基础 substring() 返回 起始索引值 到 结束索引值 之间的所有字符

镇场诗: 清心感悟智慧语,不着世间名与利.学水处下纳百川,舍尽贡高我慢意. 学有小成返哺根,愿铸一良心博客.诚心于此写经验,愿见文者得启发.------------------------------------------ code: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=ut

牛腩javascript总结(一)---基础知识

原来也听说过Javascript这个东西,一直感觉很神秘,但也没去过多了解.现在跟着牛腩哥进行了初步学习,也有了一些浅显的认识,就先总结一下. 首先,什么是javascript? javascript是一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.(Baidu百科) 简单解释一下,直译式就是这种编程语言不需要经过编译器先行编译为机器码,之后直接在CPU中就能执行: 动态类型就是说javascript的类型检查是在运行时做的,官方一些说,即程序运行时可以改变其结构,如新

JavaScript全讲-架构原则解析

因为近期一直在忙,非常久没有更新,见谅. 上篇我们讲完JavaScript函数式编程的特性,今天我们就来聊聊JavaScript中的架构. 提到JavaScript架构.非常多人会认为不可思议,由于架构多是针对类似Java这样的强语言,而JavaScript一直被看成是弱语言,它有设计模式,能够用来构建架构吗? 答案无疑是肯定的! 设计模式本身是一种非常重量级的东西.当JavaScript被当做辅助使用时.谈架构反而会添加复杂度! 所以这么多年.大家并没有看到JavaScript关于设计模式.架