JavaScript 判断对象属性存在的三种常用方法对比

本文对判断对象中是否存在指定属性的常见方式进行总结，并指出在不同应用场景下应选择合适的方法。

使用点运算符或方括号访问

一、使用点运算符（.）或方括号（[]）访问

通过点运算符或方括号语法可以获取对象的属性值。若对象自身及其原型链上均不存在该属性，则返回 undefined。需要注意的是，这种“不存在”的判断涵盖了原型链；若原型链上存在同名属性，则会返回原型链上的属性值。

// 创建对象
let test = {name : 'lei'}
// 获取对象的自身的属性
test.name   //"lei"
test["name"]   //"lei"

// 获取不存在的属性
test.age    //undefined

// 获取原型上的属性
test["toString"]  //toString() { [native code] }

// 新增一个值为undefined的属性
test.un = undefined

test.un    //undefined 不能用在属性值存在，但可能为 undefined的场景

因此，我们可以依据 Obj.x !== undefined 的返回值来推断对象 Obj 是否拥有 x 属性。

这种方式虽然简洁便捷，但其局限性在于：当属性确实存在但值为 undefined 时，无法与不存在的属性区分开来。针对这一局限，可以使用 in 运算符进行判断。

使用 in 运算符

二、使用 in 运算符

根据 MDN 文档描述，in 运算符用于检查指定的属性是否存在于指定对象或其原型链中，若存在则返回 true。

'name' in test  //true
'un' in test    //true
'toString' in test //true
'age' in test   //false

从示例结果可以看出，即使属性值为 undefined，in 运算符也能正确返回 true，从而解决了前述方法的局限。

然而，in 运算符的局限性在于它无法区分属性是定义在对象自身还是原型链上。如果业务逻辑仅要求判断对象自身的属性是否存在，则该方法不再适用，此时应使用 hasOwnProperty() 方法。

使用 hasOwnProperty() 方法

三、使用 hasOwnProperty() 方法

test.hasOwnProperty('name')  //true 自身属性
test.hasOwnProperty('age')   //false 不存在
test.hasOwnProperty('toString') //false 原型链上属性

如示例所示，只有当属性存在于对象自身时，hasOwnProperty() 才返回 true。该方法适用于仅需判断对象自身属性的场景。

总结

上述三种方法各有优劣，适用于不同的场景，有时还需组合使用。例如，在遍历对象自身属性时，通常会将 for...in 循环与 hasOwnProperty() 结合使用，以过滤掉原型链上的属性。

以上介绍了 JavaScript 中判断对象属性存在的常用方法，希望能为开发者提供帮助。如有疑问欢迎留言，我们将及时回复。感谢支持。