javascript 对象 属性-5种判断对象属性是否存在的JS解决方案！

背景

在此 Accessible Object.prototype.hasOwnProperty() 提案中，提出了一种更简单的方法来检测对象何时具有特定属性 -

Object.hasOwn()，主要目标是替换Object.prototype.hasOwnProperty()。 目前，该法案已进入第四阶段，预计2022年纳入标准。

通过添加 Object.hasOwn()，我们已经有了 5 种方法来判断对象属性是否存在！

检查属性是否存在于

JavaScript的in运算符可以用来判断一个属性是否属于一个对象，也可以用来改变一个对象的属性

在本文中，我们只讨论in的检测功能

in 运算符检测对象是否具有给定名称的属性：

> 'name' in {name: '搞前端的半夏'}
true
> 'name' in {}
false

但因为in会决定继承属性！

> 'toString' in {}
true

这是因为 {} 继承了 Object.prototype.toString() 方法

反映。 有（）

Reflect是ES2015中添加的外部对象，它提供了一种与Javascript对象交互的方式。

判断一个对象是否存在某个属性，和in运算符]的功能是完全一样的。

用法：Reflect.has(obj, propName)

Reflect.has({name:"搞前端的半夏"}, "name"); // true
Reflect.has({name:"搞前端的半夏"}, "age"); // false
Reflect.has({name:"搞前端的半夏"}, "toString"); //true

拥有自己的财产

hasOwnProperty方法可以用来衡量一个对象是否富含特定的自身属性，即用来判断某个属性是在对象本身定义的javascript 对象 属性，而不是从原型链继承的。

通过对象字面量或构造函数方法创建的对象从 Object.prototype 继承 hasOwnProperty() 。

构造方法

o = new Object();
o.name = '搞前端的半夏';
o.hasOwnProperty('name');             // 返回 true
o.hasOwnProperty('toString');         // 返回 false
o.hasOwnProperty('hasOwnProperty');   // 返回 false

对象字面量

o={name:"搞前端的半夏"}
o.hasOwnProperty('name');             // 返回 true
o.hasOwnProperty('toString');         // 返回 false
o.hasOwnProperty('hasOwnProperty');   // 返回 false

缺点不支持创建

但在以下情况下：

o =  Object.create(null)
o.hasOwnProperty('name');             // 返回 true

会直接报错：

Uncaught TypeError: o.hasOwnProperty is not a function
    at :1:3

覆盖错误

如果一个对象有一个名为 name 的自己的属性“hasOwnProperty”，那么该属性将被 Object.prototype.hasOwnProperty 覆盖，我们无法访问它：

o={hasOwnProperty:"搞前端的半夏"}
o.hasOwnProperty('name');    

直接报错

VM123:3 Uncaught TypeError: o.hasOwnProperty is not a function
    at :3:3

Object.prototype.hasOwnProperty()

用法：Object.prototype.hasOwnProperty.call(obj, propName);，接受两个参数。 注意这里我们使用call。 改变这个方向。

Object.prototype.hasOwnProperty不仅支持hasOwnProperty的相同用法，还解决了hasOwnProperty的两个缺点。

o={hasOwnProperty:"搞前端的半夏"}
Object.prototype.hasOwnProperty.call.hasOwnProperty(o,'name'); // 返回false

ES13 (ES2022) Object.hasOwn()

目前javascript 对象 属性，Object.hasOwn() 将取代 Object.prototype.hasOwnProperty.call()。

如果用Object.prototype.hasOwnProperty.call()封装的话，代码如下：

function hasOwn(obj, propName) {
  return Object.prototype.hasOwnProperty.call(obj, propName);
}

Object.hasOwn({name: '搞前端的半夏'}, 'name')  // true
Object.hasOwn({}, 'name')               //false
Object.hasOwn({}, 'toString')             //false
Object.hasOwn(Object.create(null), 'name')     //false
Object.hasOwn({hasOwnProperty: 'yes'}, 'name')  //false
Object.hasOwn({hasOwn: 'yes'}, 'name')		 //false