这次给大家带来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。
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
以上是web開發中怎樣檢測屬性的詳細內容。更多資訊請關注PHP中文網其他相關文章!