欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

web开发中怎样检测属性

程序员文章站 2022-04-07 08:21:48
...
这次给大家带来web开发中怎样检测属性,web开发中检测属性的注意事项有哪些,下面就是实战案例,一起来看一下。

用到null(以及undefined)的场景是当检测一个属性是否在对象中存在时,比如:

// 不好的写法:检测假值if (object[propertyName]) {}// 不好的写法:和null相比较if (object[propertyName] != null) {}// 不好的写法:和undefined比较if (object[propertyName] != undefined) {}

上面这段代码里的每个判断,实际上是通过给定的名字来检査属性的值,而非判断给定的名字所指的属性是否存在,因为当属性值为假值(falsy value)时结果会出错,比如0、""(空字符串)、 false、null和undefined。毕竟,这些都是属性的合法值。比如,如果属性记录了一个数字,则这个值可以是零。这样的话,上段代码中的第一个判断就会导致错误。以此类推,如果属性值为null或者undefined时,三个判断都会导致错误。

判断属性是否存在的最好的方法是使用in运算符。in运算符仅仅会简单地判断属性是否存在,而不会去读属性的值,这样就可以避免出现本小节中前文提到的有歧义的语句。 如果实例对象的属性存在、或者继承自对象的原型,in运算符都会返回true。比如:

var object = {  count: 0,  related: null};// 好的写法if ("count" in object) {  // 这里的代码会执行}// 不好的写法:检测假值if (object["count"]) {  // 这里的代码不会执行}// 好的写法if ("related" in object) {  // 这里的代码会执行}// 好的写法if (object["related"] != null) {  // 这里的代码不会执行}

如果你只想检查实例对象的某个属性是否存在,则使用hasOwnProperty()方法。所有继承自Object的JS对象都有这个方法,如果实例中存在这个属性则返回true(如果这个属属性只存在于原型里,则返回false)。需要注意的是,在IE8以及更早版本的IE中,DOM对象并非继承自Object,因此也不包含这个方法。也就是说,你在调用DOM对象的 hasOwnProperty()方法之前应当先检测其是否存在(假如你已经知道对象不是DOM,则可以省略这一步)。

// 对于所有非DOM对象来说,这是好的写法if (object.hasOwnProperty("related")) {  // 执行这里的代码}// 如果你不确定是否为DOM对象,则这样来写if ("hasOwnProperty" in object && object.hasOwnProperty("related")) {  // 执行这里的代码}

因为存在IE8以及更早版本IE的情形,在判断实例对象的属性是否存在时,我更倾向于使用in运算符,只有在需要判断实例属性时才会用到hasOwnProperty()。不管你什么时候需要检测属性的存在性,请使用in运算符或者hasOwnProperty()。这样做可以避免很多bug。

相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!

推荐阅读:

web开发中如何避免空比较

web开发中怎样检测数组

以上就是web开发中怎样检测属性的详细内容,更多请关注其它相关文章!

相关标签: web 属性 检测