JS短路原理的应用示例 精简代码的途径

 更新时间:2013年12月13日 17:41:59   作者:  
正如标题所言,js中||和&&的特性帮我们精简了代码的同时,也带来了代码可读性的降低。这就需要我们自己来权衡了,下面有个不错的示例

在js逻辑运算中,0、""、null、false、undefined、NaN都会判为false,其他都为true.

||先计算第一个运算数,如果可以被转换成true,则返回左边这个表达式的值,否则计算第二个运算数。即使||运算符的运算数不是布尔值,任然可以将它看作布尔OR运算,因为无论它返回的值是什么类型,都可以被转换为布尔值。
利用它对非布尔型的值会将其返回的特性:对非布尔型的运算数使用||,用于选取一组备选值中的第一个定义了的并且非空的值(第一个为非false的值)

例:
var max = max_width || obj.max_width || 500 ;
var attr = attr || "";这个运算经常用来判断一个变量是否已定义,如果没有定义就给他一个初始值,在给函数的参数定义一个默认值的时比较有用。

&&,它先计算第一个表达式,若为假,就不会去处理第二个表达;否则继续处理后继表达式。从左到右选取表达式的第一个为非true的表达式的值,如果一直未找到则返回最后一个表达式的值。

例:(其中的味道还需要细心琢磨)

2 && 's1' && '123' && 'sss' 表达式的值等于 'sss'
2 && 's1' && '' && 'sss' 表达式的值等于 ''
2 && 's1' && NaN && 'sss'表达式的值等于 NaN

if(a >=5){
alert("你好");
}
可以简成:
a >= 5 && alert("你好");

typeof 5和typeof !!5的区别,这是一种更严谨的写法,!!的作用是把一个其他类型的变量转成的bool类型。例如, if(!!attr) => if(attr)

js中||和&&的特性帮我们精简了代码的同时,也带来了代码可读性的降低。这就需要我们自己来权衡了。

JS中的startWith功能的巧妙实现,alert(!'asdf'.indexOf('s')) =》 !0 = true

相关文章

  • javascript+html5实现仿flash滚动播放图片的方法

    javascript+html5实现仿flash滚动播放图片的方法

    这篇文章主要介绍了javascript+html5实现仿flash滚动播放图片的方法,可实现类似Flash滚动播放的效果,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • 使用echarts实现3d柱状图+折线图

    使用echarts实现3d柱状图+折线图

    这篇文章主要为大家详细介绍了如何使用echarts实现3d柱状图和折线图,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以了解一下
    2024-12-12
  • 微信小程序开发实现首页弹框活动引导功能

    微信小程序开发实现首页弹框活动引导功能

    自己x实现的一个比较简单微信弹窗功能,主要就是教会大家对微信弹窗的用法和理解,这篇文章主要给大家介绍了关于微信小程序如何实现首页弹框活动引导功能的相关资料,需要的朋友可以参考下
    2021-08-08
  • 原生JS实现自定义滚动条效果

    原生JS实现自定义滚动条效果

    这篇文章主要为大家详细介绍了原生JS实现自定义滚动条效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • JavaScript中常用的几种字符串方法汇总(新手必看)

    JavaScript中常用的几种字符串方法汇总(新手必看)

    这篇文章主要给大家介绍了关于JavaScript中常用的几种字符串方法的相关资料,文中通过图文介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • 检查表单元素的值是否为空的实例代码

    检查表单元素的值是否为空的实例代码

    这篇文章主要介绍了检查表单元素的值是否为空的实例代码的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • Js实现动态添加删除Table行示例

    Js实现动态添加删除Table行示例

    这篇文章主要介绍了Js动态添加删除Table行的具体实现,需要的朋友可以参考下
    2014-04-04
  • webpack打包时如何修改文件名的实现示例

    webpack打包时如何修改文件名的实现示例

    本文主要介绍了webpack打包时如何修改文件名的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-06-06
  • 这样回答继承可能面试官更满意

    这样回答继承可能面试官更满意

    这篇文章主要介绍了这样回答继承可能面试官更满意,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-12-12
  • Echarts绘制气泡图的示例代码

    Echarts绘制气泡图的示例代码

    Echarts是一款基于JavaScript的数据可视化库,它提供了丰富的图表类型,本文将详细介绍如何使用Echarts来绘制气泡图,并介绍气泡图相关的配置,需要的可以参考下
    2023-12-12

最新评论