Better

Ethan的博客,欢迎访问交流

JavaScript如何优雅的进行非空判断

昨天星期六都加班到很晚,主要原因是自己代码还不够严谨,虽然后台也有些问题,但就是由于自己想当然的态度,导致App不能正常运行。

前言

在代码的世界里,非空判断是提高代码质量的主要的一环,由于JavaScript是弱类型语言,判断非空,等于以及不等于操作更加灵活,但是也更加容易出错。

有人说JavaScipt的等于操作推荐用===全等于,远离存在类型转换的==弱等于,对于这句话我其实是不认同的,按照存在即合理的观点,JavaScript既然设计思想是这样的,因此肯定有他的用武之地,那么用武之地在哪里呢,我觉得这就需要经验了。

许多开发者认为 === 的行为更加容易预测,所以他们总是主张使用 === 而劝人们远离 ==,我认为这种看法是非常短视的。如果你花点时间来搞清楚它是如何工作的话,== 绝对是一个能够帮助你程序的强大工具。

有了非空判断的思想,很多时候的判断,我个人强迫症看他很不爽,不够优雅,因此我在思考有没有一种优雅,简洁却能达到同样效果的写法呢。

以下只是自己的简单总结,不代表完全正确,会在进步中不断更新。

数据类型的判断可以见另一篇博客:数据类型判断

流控制语句

if语句在进行下一步操作之前,会自动把任何值转换成布尔值,在流控制语句中使用非布尔值,是极为常见的一个错误来源。

以下是转换规则的常见情况:

  • 未使用过的命名变量-->undefined-->false<--0
  • false、undefinded、null、0、"" 为 false
  • true、1、"somestring"、[Object] 为 true

==操作符

==操作符会存在类型转换,具体的转换情景有:

  • 如果两个值具有相同类型,会进行===比较,返回===的比较值
  • 如果两个值不具有相同类型,也有可能返回true ,因为会进行类型转换
  • 如果一个值是null,另一个值是undefined,返回true
  • 如果一个值是string,另个是number,会把string转换成number再进行比较
  • 如果一个值是true,会把它转成1再比较,false会转成0
  • 如果一个值是Object,另一个是number或者string,先调用valueOf(),如果还是对象,则toString()转换成原始类型再进行比较

===操作符

===运算规则如下:

  • 如果两个值的类型不同,直接返回false。
  • 同一类型的原始类型的值(数值、字符串、布尔值)比较时,值相同就返回true,值不同就返回false。
  • 两个复合类型(对象、数组、函数)的数据比较时,不是比较它们的值是否相等,而是比较它们是否指向同一个对象。
  • undefined 和 null 与自身严格相等。

&&操作符和||操作符

灵活的使用&&和||在很多场景中可以减少很多的if判断,是代码看上去更优雅。

  • 执行回调函数

    // 回调函数的执行如果不进行非空判断,则会抛出错误,下面的写法可以阻止一部分错误
    callback&&callback()
    // 为什么是一部分错误呢,因为方法比较特殊,可以执行则必须是方法。严谨如下:
    typeof callback === 'function' && callback()
    
  • 读取对象的属性

    // 读取属性不同于执行方法,只要对象存在即可,即使没有对应属性也不会报错,只不过读取为undefined
    user&&user.username
    
  • 函数返回值的缺省值

    // 作为返回返回值时,如果&&操作符中间某一步不通过,可以使用||作为缺省值
    user&&user.name || '陌生人'
    

后续

毕竟大型项目经验欠缺,仅总结了这么点,可能只是一个思考,又或许一切都只是源于强迫症,方向都是错的,后面是推翻还是完善呢,好好努力吧!



留言