javascript教程:关于if简写语句优化的方法


Posted in Javascript onMay 17, 2014

UglifyJS是一个对javascript进行压缩和美化的工具,在它的文档说明中,我看到了几种关于if语句优化的方法。尽管我还没使用它去做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作。也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许会改变看法。

一、使用常见的三元操作符

if (foo) bar(); else baz(); ==> foo?bar():baz();
if (!foo) bar(); else baz(); ==> foo?baz():bar();
if (foo) return bar(); else return baz(); ==> return foo?bar():baz();

对于以上使用三元操作符来优化if语句你肯定不会陌生,或许你经常使用它。

三水点靠木给出的例子:

<script>
var i=9
var ii=(i>8)?100:9;
alert(ii);
</script>

输出结果:

100

二、使用and(&&)和or(||)运算符

if (foo) bar(); ==> foo&&bar();
if (!foo) bar(); ==> foo||bar();

老实说,我并没有这样去写过代码,这种写法我在学习《鸟哥的 Linux 私房菜》时看到过,但我并没想到在js中实现它。

三、省略大括号{}

if (foo) return bar(); else something(); ==> {if(foo)return bar();something()}

这种写法你我都很熟悉,但我建议在代码优化的时候这样做,或者交给UglifyJS帮你去解决。毕竟少一个大括号,代码的可阅读性并不高。

写到这里,我想到jQuery之父在《精通 JavaScript》中的一个获取HTML元素属性的方法。

function getAttr(el, attrName){
var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName;
};

如果我们不这样写,可能我们需借助于两个if语句来进行处理,而上面的代码不仅简洁有效,而且可阅读性强。

仔细想想,好些时候我们都能找到解决问题的有效途径,但关键在于我们是否用心去寻找一种更好的途径。

【javascript技巧】if(x==null)简写

if(x==null)或if (typeof (x) == 'undefined')可以简写为if(!x),未验证。

反之if(x)表示x非空

判断对象是否存在

if(document.form1.softurl9){
//判断是否存在softurl9,防止js出错
}
if(document.getElementById("softurl9")){
//判断是否存在softurl9,防止js出错
}

补充:

javascript || && 简写 if

<script type="text/javascript">     如果你想写 
    if (!false) 
    { 
        alert('false'); 
    } 
    不妨考虑写成: 
    false || alert('false'); 
    false || alert('false'); true || alert('true'); //output false; 
    用"||"的情况下,第一个条件true,不检测第二个直接返回true.第一个条件false,会执行第二个条件检测 
    false && alert('false'); true && alert('true'); //output true 
    用"&&"的情况下,第一个条件true,还会检测第二个条件。第一个条件false,直接返回false退出。 
    简而言之, 替换 if 的简单实用, ? : 替换 if else的实用。 写短小精悍的代码 
    usage: 
    $("#regform input[type!=hidden]").each( 
        function(index) { 
            $(this).parent().has("div.valid-under").length || $('<div class="valid-under"></div>').appendTo($(this).parent()); 
        } 
    );   
</script>
Javascript 相关文章推荐
用prototype实现的简单小巧的多级联动菜单
Mar 24 Javascript
asp.net+jquery滚动滚动条加载数据的下拉控件
Jun 25 Javascript
详谈javascript中的cookie
Jun 03 Javascript
浅析JavaScript 调试方法和技巧
Oct 22 Javascript
JavaScript获取当前url根目录(路径)
Jun 17 Javascript
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
Aug 05 Javascript
jQuery progressbar通过Ajax请求实现后台进度实时功能
Oct 11 Javascript
JS动态添加选项案例分析
Oct 17 Javascript
Javascript中JSON数据分组优化实践及JS操作JSON总结
Dec 22 Javascript
Vuejs监听vuex中值的变化的方法示例
Dec 02 Javascript
你可能从未使用过的11+个JavaScript特性(小结)
Jan 08 Javascript
springboot+vue实现文件上传下载
Nov 17 Vue.js
javascript if条件判断方法小结
May 17 #Javascript
js加减乘除丢失精度问题解决方法
May 16 #Javascript
js脚本获取webform服务器控件的方法
May 16 #Javascript
js加入收藏夹代码(兼容ie/ff/op)
May 16 #Javascript
javascript生成随机数的方法
May 16 #Javascript
从零学jquery之如何使用回调函数
May 16 #Javascript
一张表格告诉你windows.onload()与$(document).ready()的区别
May 16 #Javascript
You might like
discuz论坛 用户登录 后台程序代码
2008/11/27 PHP
PHP中strtotime函数使用方法分享
2012/01/10 PHP
IIS安装Apache伪静态插件的具体操作图文
2013/07/01 PHP
PHP中多维数组的foreach遍历示例
2014/06/13 PHP
php上传图片并压缩的实现方法
2015/12/22 PHP
PHP实现阿里大鱼短信验证的实例代码
2017/07/10 PHP
PHP利用DWZ.CN服务生成短网址
2019/08/11 PHP
JS跨域总结
2012/08/30 Javascript
通用javascript代码判断版本号是否在版本范围之间
2015/11/29 Javascript
jQuery Validate表单验证入门学习
2015/12/18 Javascript
jQuery flip插件实现的翻牌效果示例【附demo源码下载】
2016/09/20 Javascript
vue插件tab选项卡使用小结
2016/10/27 Javascript
js制作简单的音乐播放器的示例代码
2017/08/28 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
vue 系列——vue2-webpack2框架搭建踩坑之路
2017/12/22 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
javascript Canvas动态粒子连线
2020/01/01 Javascript
nuxt 每个页面head标签内容设置方式
2020/11/05 Javascript
vue+elementUI动态增加表单项并添加验证的代码详解
2020/12/17 Vue.js
详解JavaScript中的this指向问题
2021/02/05 Javascript
[02:36]DOTA2英雄基础教程 一击致命幻影刺客
2013/12/06 DOTA
在Python的web框架中编写创建日志的程序的教程
2015/04/30 Python
浅析Python中else语句块的使用技巧
2016/06/16 Python
BP神经网络原理及Python实现代码
2018/12/18 Python
对Python Class之间函数的调用关系详解
2019/01/23 Python
python导入pandas具体步骤方法
2019/06/23 Python
基于Python的ModbusTCP客户端实现详解
2019/07/13 Python
python网络编程 使用UDP、TCP协议收发信息详解
2019/08/29 Python
香港永安旅游网:Wing On Travel
2017/04/10 全球购物
在阿联酋购买翻新手机和平板电脑:Teckzu
2021/02/12 全球购物
经验丰富大学生村干部自我鉴定
2014/01/22 职场文书
伦敦奥运会口号
2014/06/13 职场文书
给妈妈洗脚活动方案
2014/08/16 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
Python快速实现一键抠图功能的全过程
2021/06/29 Python
什么是动态刷新率DRR? Windows11动态刷新率功能介绍
2021/11/21 数码科技