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。

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

推荐阅读：

web开发中如何避免空比较

web开发中怎样检测数组