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 相关文章推荐
jquery text,radio,checkbox,select操作实现代码
Jul 09 Javascript
Javascript this 的一些学习总结
Aug 02 Javascript
jquery打开直接跳到网页最下面、最低端实现代码
Apr 22 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
Dec 26 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
Jun 03 Javascript
react.js 父子组件数据绑定实时通讯的示例代码
Sep 25 Javascript
vue 自定义提示框(Toast)组件的实现代码
Aug 17 Javascript
关于在vue 中使用百度ueEditor编辑器的方法实例代码
Sep 14 Javascript
在vue中更换字体,本地存储字体非引用在线字体库的方法
Sep 28 Javascript
详解微信小程序胶囊按钮返回|首页自定义导航栏功能
Jun 14 Javascript
JavaScript箭头函数中的this详解
Jun 19 Javascript
解决vue项目axios每次请求session不一致的问题
Oct 24 Javascript
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
十大催泪虐心动漫,你能坚持看到第几部?
2020/03/04 日漫
什么是调频(FM)、调幅(AM)、短波(SW)、长波(LW)
2021/03/01 无线电
php同时使用session和cookie来保存用户登录信息的实现代码
2016/05/13 PHP
php写入文件不覆盖的实例讲解
2019/09/17 PHP
JavaScript 拖拉缩放效果
2008/12/10 Javascript
JS操作图片(增,删,改) 例子
2013/04/17 Javascript
javascript中强制执行toString()具体实现
2013/04/27 Javascript
js小数计算小数点后显示多位小数的实现方法
2016/05/30 Javascript
canvas实现手机端用来上传用户头像的代码
2016/10/20 Javascript
学习vue.js表单控件绑定操作
2016/12/05 Javascript
vue购物车插件编写代码
2017/11/27 Javascript
详解js跨域请求的两种方式,支持post请求
2018/05/05 Javascript
vue 取出v-for循环中的index值实例
2019/11/09 Javascript
js实现3D粒子酷炫动态旋转特效
2020/09/13 Javascript
Python实现自动添加脚本头信息的示例代码
2016/09/02 Python
Python中使用多进程来实现并行处理的方法小结
2017/08/09 Python
python3正则提取字符串里的中文实例
2019/01/31 Python
对python3 sort sorted 函数的应用详解
2019/06/27 Python
python等差数列求和公式前 100 项的和实例
2020/02/25 Python
Keras预训练的ImageNet模型实现分类操作
2020/07/07 Python
Python通用唯一标识符uuid模块使用案例
2020/09/10 Python
通过Python pyecharts输出保存图片代码实例
2020/11/25 Python
python使用正则表达式匹配txt特定字符串(有换行)
2020/12/09 Python
奥地利手表、香水、化妆品和珠宝购物网站:Brasty.at
2021/01/17 全球购物
浙大网新C/C++面试解惑
2015/05/27 面试题
医学专业五年以上个人求职信
2013/12/03 职场文书
《挑山工》的教学反思
2014/02/16 职场文书
入党自我鉴定
2014/03/25 职场文书
导师推荐信范文
2014/05/09 职场文书
电气工程及其自动化专业毕业生自荐信
2014/06/21 职场文书
教师批评与自我批评心得体会
2014/10/16 职场文书
2014年个人年终总结
2015/03/09 职场文书
孔子观后感
2015/06/08 职场文书
关于 Python json中load和loads区别
2021/11/07 Python
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
2022/04/19 Javascript
全网非常详细的pytest配置文件
2022/07/15 Python