在js中经常能看到以下的写法:

var obj1 = a || b || c;
var obj2 = a && b && c;

刚看到时,很容易认为返回的两个变量都是 boolean 类型,但实际上返回的却是 a、b、c的其中之一。

其实这是一种相对安全并且高效的适配写法,可以避免过多的 if 判断,使代码看上去更简洁。

首先,|| 和 && 比较抽象的逻辑是:

1、a || b,如果a存在,则返回a;否则返回b

2、a && b,如果a存在,则返回b,否则返回a

这种逻辑理解起来确实有点抓狂

本质是什么呢?
&& 和 || 的作用只有一个:进行布尔值的且和或的运算。当运算到某一个变量就得出最终结果之后,就返回哪个变量

在javascript中:
以下内容会被当成 false 处理:"" , false , 0 , null , undefined , NaN
其他都是 true

注意:字符串 "false" 也会被当做 true 处理,在未转型的情况下他是字符串,属于一个对象,所以是 true

所以:
a || b:     如果 a 是 true,那么 b 不管是 true 还是 false,都返回 true。因此不用判断 b 了,这个时候刚好判断到 a,因此返回 a。
                如果 a 是 false,那么就要判断 b,如果 b 是 true,那么返回 true,如果 b 是 false,返回 false,其实不就是返回 b 了吗。

a && b:  如果 a 是 false,那么 b 不管是 true 还是 false,都返回 false,因此不用判断 b 了,这个时候刚好判断到 a,因此返回 a。
                如果 a 是 true,那么就要再判断 b,和刚刚一样,不管 b 是 true 是 false,都返回 b。

JavaScript中烧脑的&&和||的更多相关文章

  1. Javascript中的原型链、prototype、__proto__的关系

    javascript  2016-10-06  1120  9 上图是本宝宝用Illustrator制作的可视化信息图,希望能帮你理清Javascript对象与__proto__.prototype和 ...

  2. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  3. javascript中的this与函数讲解

    前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...

  4. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  5. javascript中的操作符详解1

    好久没有写点什么了,根据博主的技术,仍然写一点javascript新手入门文章,接下来我们一起来探讨javascript的操作符. 一.前言 javascript中有许多操作符,但是许多初学者并不理解 ...

  6. 掌握javascript中的最基础数据结构-----数组

    这是一篇<数据结构与算法javascript描述>的读书笔记.主要梳理了关于数组的知识.部分内容及源码来自原作. 书中第一章介绍了如何配置javascript运行环境:javascript ...

  7. javascript中变量提升的理解

    网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...

  8. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  9. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

随机推荐

  1. cef3加载flash闪烁问题非easyhook的另外一种解决方法

    1.现象 cef3加载flash,会出现弹出命令行窗口,显示not sandboxed,影响使用体验. 网上的解决方法,参考此文. http://blog.csdn.NET/zx2356/articl ...

  2. log4j.properties配置模板

    # For JBoss: Avoid to setup Log4J outside $JBOSS_HOME/server/default/deploy/log4j.xml! # For all oth ...

  3. Java泛型类型

    E element 常用于集合中表示存放元素 T type Java类 K key 键 V value 值 N number 数值类型 ? 不确定的类型 一种约定俗成吧

  4. 【基于初学者的SSH】struts02 数据封装的三种方式详解

    struts的数据封装共有3中方式,属性封装,模型驱动封装和表达式封装,其中表达式封装为常用 一:属性封装: 属性封装其实就是自己定义变量,注意变量名要和表单的name属性名一致,然后生成get和se ...

  5. 软件架构系列一:C4模型

    本文要点预览:因为软件系统的分布式特点以及开发团队的分布性,了解软件架构的基础变得越来越重要.而在过度设计和毫无设计之间,我们应该把注意力放在对软件系统有重大影响的决策和权衡上.好的架构师应该是团队的 ...

  6. HTML标签参考(二)

    一些重要的标签 • ol li  <ol><li></li></ol>这是一组标签,它们二者都是成对出现的,每一个标签单独出现都是没有意义的事情. 这一 ...

  7. sqlserver 获取数据库、表和字段相关信息

    --获取指定服务器上的所有数据库 SELECT Name FROM Master..SysDatabases ORDER BY Name --获取指定数据库下所有表 SELECT Name FROM ...

  8. RESTful API的十个最佳实践

    WebAPI在过去几年里非常的盛行,我们很多以往的技术手段都慢慢的转换为使用WebAPI来开发,因为它的语法简单规范化,以及轻量级等特点,这种方式收到了广泛的推崇. 通常我们使用RESTFul(Rep ...

  9. web 应用响应乱码问题

    非西欧语系乱码原因 在没有设置任何内容类型或编码之前,HttpServletResponse使用的字符编码默认是ISO-8859-1.也就是说,如果直接输出中文,在浏览器上就会看到乱码. 有两种方式可 ...

  10. 带你从零学ReactNative开发跨平台App开发(三)

    ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...