今天百度发现一个简化长if   else if 语句的方法,看起来及其强大,感觉这样虽然对系统性能提升没有帮助但是代码更简练了,分析了一番,下面先说说自己学到的理论。

首先要弄清楚js 中对于 变量,在逻辑判断中会把对应的变量转为boolean类型,转化规则是非空字符串转为true,空字符串转为false,非0数字转为true,0或者NaN转为false,特殊的基本数据类型undefined转为false,null转为false,当然逻辑判断完赋值的时候会转化回去。

1、逻辑与(&&),例如:a && b && c ,其中a,b,c是任意类型的变量的代表,在逻辑与中会有短路现象,a、b、c都是true整个语句才是true,否则整个语句是false, 这些是常识,

大多数人不知道的是另一方面如果整个逻辑语句执行完毕后如果没有false那就返回最后一个逻辑判断即c,而对这两种情况,返回的都是变量的实际值,而不是转化为boolean后的值,可以理解为狗熊掰棒子,掰一个不是合格的棒子就扔掉,继续掰继续仍,然后碰到了合格的就拿这个,因为其它的已经扔了。

2、逻辑或(||),例如:a || b || c,其中a,b,c亦是任意类型变量的代表,这里同样会有短路现象,相反,逻辑或碰到true会短路不再执行后面的语句直接返回true,没有碰到true就返回最后一个false,然后返回转化前的变量,同样可以通过狗熊掰棒子的例子来理解,只是检查的标准不一样了。

接下来就该实战了,普通的判断表达式:

if(a == undefined){ // 初始化

a = 0;

};

强化后:var a = a || 0; // 初始化

还有更强大的:
普通版:

var a = 0;

var length = 10;

if(length>2 && length<5){

 a = 2;

}

else if(length>5 && length<8){

 a = 4;

}

else{

 a = 6;

}

强化版:

var a = ((length>2 && length<5) && 2) || ((length>5 && length<8) && 4) || 6; // 省了N行代码,可以这样记忆,if 与else if可以用||逻辑或来代替,而判断条件和该条件下的返回结果可以通过逻辑与来判断。

另外:

普通版:

var a = 0;

var length = 10;

if(length == 2){

 a = 2;

}

else if(length == 4){

 a = 4;

}

else{

 a = 6;

}

强化版:

var a = {2:2,4:4}[length] ||  6; // 一个变量可以合并,省了N行+M列代码。

js 基础-&& || 逻辑与和逻辑或的更多相关文章

  1. JS基础,相亲,逻辑训练

    简单逻辑 <script> var a = prompt("有房么?"); // if(a == "有") { alert("结婚吧&qu ...

  2. 研究分析JS中的三种逻辑语句

    JS中的三种逻辑语句:顺序.分支和循环语句. 一.顺序语句 代码规范如下:1. <script type="text/javascript"> var a = 10;  ...

  3. Flask基础(06)-->视图常用逻辑

    Flask基础(06)-->视图常用逻辑 返回json 重定向:url_for 自定义状态码 返回json:在使用 Flask 写一个接口时候需要给客户端返回 JSON 数据,在 Flask 中 ...

  4. js 动态添加元素 删除元素逻辑

    js 动态添加元素 删除元素逻辑 var obox=document.getElementById("box"); oadd.onclick=function(){ var odi ...

  5. js 基础篇(点击事件轮播图的实现)

    轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...

  6. Node.js基础与实战

    Node.js基础与实战 Node.jsJS高级进阶 NODE原理与解析 REPL交互环境 模块与NPM Buffer缓存区 fs文件操作 Stream流 TCP&UDP 异步编程 HTTP& ...

  7. JavaScript学习笔记 - 进阶篇(1)- JS基础语法

    前言 JavaScript能做什么? 1.增强页面动态效果(如:下拉菜单.图片轮播.信息滚动等) 2.实现页面与用户之间的实时.动态交互(如:用户注册.登陆验证等) JS进阶篇学习什么? 在JavaS ...

  8. 前端面试题目汇总摘录(JS 基础篇)

    JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...

  9. 1、js基础内容

    js基础内容 1. 编辑器 编译环境 浏览器 编辑软件 sublime DW H5Build Atom ==[注]尽可能多的去使用编辑器去编辑代码.== Html+css ==JS 逻辑== 比作建设 ...

  10. JS基础学习——作用域

    JS基础学习--作用域 什么是作用域 变量的作用域就是变量能被访问到的代码范围,比如在下面的这个js代码中,变量a的作用域就是函数foo,因此在全局作用域内的console.log(a)语句不能访问到 ...

随机推荐

  1. Linux 小知识翻译 - 「端口和端口号」

    这次说说「端口」和「端口号」. 平时经常会听人说「打开了80号端口」,为了安全「不要打开多余的端口」等等.那么,这里的端口或者端口号是什么呢? 首先,「端口」是TCP或者UDP上使用的概念,经常被比喻 ...

  2. ES5-ES6-ES7_let关键字声明变量

    let命令的介绍 let是ECMAScript6中新增的关键字,用于声明变量.它的用法类似于var var a = 3 let b = 4 let变量的声明 let 命令的特点不允许在同一作用域下声明 ...

  3. Handler基本运行机制

    Handler,Looper,MessageQueue的基本原理(三个组成一个消息处理机制)最大的作用就是实现线程间的通信 Handler负责把消息对象加入到消息队列当中 Looper(循环器)是一个 ...

  4. Java中关于CountDownLatch的使用

    CyclicBarrier工具类主要是控制多个线程的一起执行,演示程序: import java.util.Random; import java.util.concurrent.CountDownL ...

  5. Spring Cloud构建微服务架构 - 服务网关

    通过之前几篇Spring Cloud中几个核心组件的介绍,我们已经可以构建一个简略的(不够完善)微服务架构了.比如下图所示: alt 我们使用Spring Cloud Netflix中的Eureka实 ...

  6. openssl windows 生成公钥与私钥

    链接: https://pan.baidu.com/s/1qn-qeFxovor-vcAWFl8jIw 提取码: zy5v 一,下载安装windows平台openssl密钥生成工具,执行安装目录bin ...

  7. 转载 +function ($) { "use strict";}(window.jQuery);全面分析

    转载 https://www.cnblogs.com/cndotabestdota/p/5664112.html +function ($) { "use strict";}(wi ...

  8. mysql order by 排序的问题

    参考博客http://blog.csdn.net/hollboy/article/details/13296601 mysql order by 的排序在今天时候遇到了问题 情景是:将排序的字段设置成 ...

  9. LeetCode算法题详解之两个数组的交集

    题目背景: 这个与我们高中时期学习的交集是一样的,顺便复习一下相关的数学知识有助于更好的理解. 交集的定义: 对于两个集合A和B,定义A和B的交集为C,其中C={x|x属于A且X属于B},记作A∩B. ...

  10. vue自定义指令(Directive中的clickoutside.js)的理解

    阅读目录 vue自定义指令clickoutside.js的理解 回到顶部 vue自定义指令clickoutside.js的理解 vue自定义指令请看如下博客: vue自定义指令 一般在需要 DOM 操 ...