Javascript优化技巧之短路表达式详细介绍


Posted in Javascript onMarch 27, 2015

什么是短路表达式?

短路表达式:作为"&&"和"||"操作符的操作数表达式,这些表达式在进行求值时,只要最终的结果已经可以确定是真或假,求值过程便告终止,这称之为短路求值。这是这两个操作符的一个重要属性。

一个最简单的例子:

foo = foo||bar;

这行代码是什么意思?答案:

//如果foo存在,值不变,否则把bar的值赋给foo

if(!foo)

    foo = bar;

在javascript的逻辑运算中,0、""、null、false、undefined、NaN都会判定为false,而其他都为true。所以在上式的foo = foo||bar;中,||先计算第一个运算数,如果可以被转换成true,也就是表示foo已经存在有值,那么返回左边这个表达式的值,否则计算第二个运算数bar。

另外,即使||运算符的运算数不是布尔值,仍然可以将它看作布尔OR运算,因为无论它返回的值是什么类型,都可以被转换为布尔值。

当然,使用如下做法会更加严谨:

if(foo)      //不够严谨

 

if(!!foo)    //更为严谨,!!可将其他类型的值转换为boolean类型

可以测试一下:

var foo;

var number = 1;

var string = "string";

var obj = {};

var arr = [];

 

 

console.log(typeof(foo));  // undefined

console.log(typeof(number));//number

console.log(typeof(string));
//string

console.log(typeof(obj));
//object


console.log(typeof(arr));
//object

 

console.log(typeof(!!foo));  // boolean

console.log(typeof(!!number));
//boolean

console.log(typeof(!!string));
//boolean

console.log(typeof(!!obj));
//boolean

console.log(typeof(!!arr));
//boolean

利用这一点可以很好的符合,优化javascript工程一文中提到的,使脚本少运行或者不运行,以达到优化javascript的目的。但是需要注意的是,这样写帮我们精简了代码的同时,也带来了代码可读性的降低的缺点。所以比较好的做好是添加是适当的注释。

Javascript 相关文章推荐
js中查找最近的共有祖先元素的实现代码
Dec 30 Javascript
JavaScript中指定函数名称的相关方法
Jun 04 Javascript
javascript中的previousSibling和nextSibling的正确用法
Sep 16 Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 Javascript
纯前端JavaScript实现Excel IO案例分享
Aug 26 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
js利用for in循环获取 一个对象的所有属性以及值的实例
Mar 30 Javascript
Vue2几种常见开局方式详解
Sep 09 Javascript
vue2.0使用swiper组件实现轮播效果
Nov 27 Javascript
Vue实现双向绑定的原理以及响应式数据的方法
Jul 02 Javascript
vue的过滤器filter实例详解
Sep 17 Javascript
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
学习JavaScript编程语言的8张思维导图分享
Mar 27 #Javascript
JavaScript中的函数声明和函数表达式区别浅析
Mar 27 #Javascript
jQuery使用fadein方法实现渐出效果实例
Mar 27 #Javascript
jQuery使用fadeout实现元素渐隐效果的方法
Mar 27 #Javascript
javascript包装对象实例分析
Mar 27 #Javascript
javascript操作select元素实例分析
Mar 27 #Javascript
jquery使用slideDown实现模块缓慢拉出效果的方法
Mar 27 #Javascript
You might like
兼容firefox,chrome的网页灰度效果
2011/08/08 PHP
PHP的简易冒泡法代码分享
2012/08/28 PHP
CI框架中zip类应用示例
2014/06/17 PHP
PHP基于GD库的缩略图生成代码(支持jpg,gif,png格式)
2014/06/19 PHP
浅析php原型模式
2014/11/25 PHP
PHP+MySQL使用mysql_num_rows实现模糊查询图书信息功能
2018/05/31 PHP
PhpStorm2020.1 安装 debug - Postman 调用的详细教程
2020/08/17 PHP
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
TreeView 用法(有代码)(asp.net)
2011/07/15 Javascript
document.write()及其输出内容的样式、位置控制
2013/08/12 Javascript
Html5的placeholder属性(IE兼容)实现代码
2014/08/30 Javascript
nodejs连接mongodb数据库实现增删改查
2016/12/01 NodeJs
JavaScript上传文件时不用刷新页面方法总结(推荐)
2017/08/15 Javascript
vue移动端弹框组件的实例
2018/09/25 Javascript
JavaScript设计模式之命令模式实例分析
2019/01/16 Javascript
Vue实现图书管理案例
2021/01/20 Vue.js
[02:40]2014DOTA2 国际邀请赛中国区预选赛 四大豪门抵达华西村
2014/05/23 DOTA
[00:31]DOTA2荣耀之路7:Miracle-空血无敌斩
2018/05/31 DOTA
Python fileinput模块使用实例
2015/05/28 Python
Python 找到列表中满足某些条件的元素方法
2018/06/26 Python
NLTK 3.2.4 环境搭建教程
2018/09/19 Python
python 读取鼠标点击坐标的实例
2018/12/29 Python
Django中提示消息messages的设置方式
2019/11/15 Python
python 实用工具状态机transitions
2020/11/21 Python
12个不为大家熟知的HTML5设计小技巧
2016/06/02 HTML / CSS
手对手的教你用canvas画一个简单的海报的方法示例
2018/12/10 HTML / CSS
综合素质的自我鉴定
2013/10/07 职场文书
电子信息专业自荐书
2014/02/04 职场文书
广告学专业毕业生自荐信
2014/05/28 职场文书
学校学雷锋活动总结
2014/06/26 职场文书
端午节活动总结
2014/08/26 职场文书
工商局局长个人对照检查材料思想汇报
2014/09/23 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
简单租房协议书
2014/10/21 职场文书
巾帼文明岗事迹材料
2014/12/24 职场文书
基于python实现银行管理系统
2021/04/20 Python