Javascript优化细节:短路表达式
什么是短路表达式?
短路表达式:作为"&&"和"||"操作符的操作数表达式,这些表达式在进行求值时,只要最终的结果已经可以确定是真或假,求值过程便告终止,这称之为短路求值。这是这两个操作符的一个重要属性。
一个最简单的例子:
1 | foo = foo||bar; |
这行代码是什么意思?答案:
1 2 3 | //如果foo存在,值不变,否则把bar的值赋给foo if (!foo) foo = bar; |
在javascript的逻辑运算中,0、""、null、false、undefined、NaN都会判定为false,而其他都为true。所以在上式的foo = foo||bar;中,||先计算第一个运算数,如果可以被转换成true,也就是表示foo已经存在有值,那么返回左边这个表达式的值,否则计算第二个运算数bar。
另外,即使||运算符的运算数不是布尔值,仍然可以将它看作布尔OR运算,因为无论它返回的值是什么类型,都可以被转换为布尔值。
当然,使用如下做法会更加严谨:
1 2 3 | if (foo) //不够严谨 if (!!foo) //更为严谨,!!可将其他类型的值转换为boolean类型 |
可以测试一下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | 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的目的。但是需要注意的是,这样写帮我们精简了代码的同时,也带来了代码可读性的降低的缺点。所以比较好的做好是添加是适当的注释。
更多优化方法可以参看我上一篇blog:前端工程优化:javascript的优化小结。
如果觉得文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
打赏支持
+
(^_^)打个赏喝个咖啡(^_^)


分类:
编码技巧
, Javascript
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析