js技巧:避免获取变量或属性报错

496 浏览发布于 作者 zouyang (欢迎转载-请注明出处链接)留下评论分享按钮

一、

1、先看一个示例1:



var a = 'abc';  

alert(window.a)   //abc  
alert(a) //abc

alert(window.b)   //undefined
alert(b) //报错

从上例可以看出,如果一个变量b没有声明,alert(window.b) 返回undefined,alert(b) 会直接报错。

 

2、知识点1:

使用一个不存在的变量,会报错;
使用一个不存在的属性,返回undefined。当我们把某个变量当作一个属性来获取时,即便该变量不存在,也不会导致程序报错。

 

3、应用1:

在进行if条件判断时,如果条件值如果可能是一个不存在的变量值,存在报错风险。
此时可用对象属性的方式来调用该变量。


//JQ 2.0.3源码: 354行
if ( window.$ === jQuery ) {
    window.$ = _$;
}

 

二、

1、先看一个示例2:



var sTitle = book.subtitle;  //Undefined
var nNum = book.subtitle.len;  //报错,因为subtitle是undefined,undefined是没有len属性的

从上例可以看出,除非确定book和subtitle都存在,否则不能那样写表达式。
 

2、知识点2:

如果对象不存在,试图查询一个不存在对象的属性,会报错。
 

3、应用2:



//一种冗余但易懂的写法:
var nNum = undefined;
if(book){
  if(book.subtitle){
     nNum = book.subtitle.len;
  }
}

//推荐写法:
var nNum = book && book.subtitle && book.subtitle.len;

PS:我有另一篇文章专门介绍&& || 这类运算符在赋值时的用法的(JQ源码里大量使用此类书写格式),点此前往
 

以上,感谢阅读~如有不足,欢迎建议与指正~~~:)

想要打赏,请点击这里

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注