卡卡网

在程序编写中，当你要使用某个属性时，你可能要首先判断该属性是否存在，以免抛出错误。在本文中，将介绍3种方法，判断JS对象是否具有某一属性。

• hasOwnProperty()方法
• in运算符
• 与undefined的比较

1、hasOwnProperty()方法

每个 JavaScript 对象都有一个特殊的方法 object.hasOwnProperty('myProp')，它返回一个布尔值，指示是否object有一个属性myProp。

在以下示例中，hasOwnProperty()确定属性name和realName的存在：

const webkaka = {
  name: '卡卡网'
};
webkaka.hasOwnProperty('name');     // => true
webkaka.hasOwnProperty('realName'); // => false

webkaka.hasOwnProperty('name')返回true，因为属性name存在于webkaka对象中。

另一方面，webkaka没有realName属性，因此webkaka.hasOwnProperty('realName')返回false。

方法名称hasOwnProperty()表明它查看对象自身的属性，自己的属性是直接在对象上定义的属性，而没有检测到继承的属性：

const webkaka = {
  name: '卡卡网'
};
webkaka.toString; // => function() {...}
webkaka.hasOwnProperty('toString'); // => false

2、in运算符

'myProp' in object还确定myProp属性是否存在于object。

我们可以使用in运算符来检测webkaka对象中的name和realName的存在：

const webkaka = {
  name: '卡卡网'
};
'name' in webkaka;     // => true
'realName' in webkaka; // => false

'name' in webkaka 为true，因为webkaka有一个属性name。

另一方面，'realName' in webkaka 结果为false，因为webkaka没有名为'realName'的属性。

in运算符的语法很短，我更喜欢它而不是hasOwnProperty()方法。

hasOwnProperty()方法和in操作符之间的主要区别在于后者能检查对象自身和继承的属性：

const webkaka = {
  name: '卡卡网'
};
webkaka.toString; // => function() {...}
'toString' in webkaka;              // => true
webkaka.hasOwnProperty('toString'); // => false

3、与undefined比较

从对象访问不存在的属性会导致undefined：

const webkaka = {
  name: '卡卡网'
};
webkaka.name;     // => '卡卡网'
webkaka.realName; // => undefined

webkaka.realName为undefined是因为webkaka缺少realName属性。

现在可以看到一个思路：可以通过比较undefined来判断属性的存在：

const webkaka = {
  name: '卡卡网'
};
webkaka.name !== undefined;     // => true
webkaka.realName !== undefined; // => false

webkaka.name !== undefined 结果为true，这表明属性是存在的。

另一方面，webkaka.realName !== undefined 是 false，表示realName属性是不存在的。

如果某属性存在，但具有undefined（这种情况很少发生），则比较undefined就会错误地认为为false：

const webkaka = {
  name: undefined
};
webkaka.name !== undefined; // => false

即使属性name存在（但有undefined值），webkaka.name !== undefined 判断为false，错误地认为缺少name属性。

4、总结

本文介绍了3种方法来检查属性是否存在。

第一种方法是调用 object.hasOwnProperty(propName)，如果propName存在于object对象中，则该方法返回true，否则返回false。

hasOwnProperty()仅在对象自身的属性内搜索。

第二种方法使用propName in object运算符，存在属性则运算符判断结果为true，否则为false。

in运算符在自己的和继承的属性中查找属性是否存在。

最后，可以直接使用object.propName !== undefined和undefined比较，但这种方法有误判断的可能。

您可能对以下文章也感兴趣

• 【如何合理使用】JavaScript访问对象属性的3种方法
• JS删除对象属性：这种方法比delete快50倍
• 【实例】演示2种方法JS从对象中删除属性

标签: 对象  属性