JS | 属性对象的 hasOwnProperty 方法

1,608 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第20天,点击查看活动详情

hasOwnProperty()  方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)

has Own Property 直译过来是拥有自己的财产,其实就是指对象的原型链中的属性,完整写法是:

Object.prototype.hasOwnProperty()

这个方法是定义在 Object.prototype 对象之上的 Object 的原型方法,所有 Object 的实例对象都会继承 hasOwnProperty() 方法

原型

定义一个对象并在控制台输出对象的值:

const obj = {
    a: 100,
    b:{
        c: 200
    },
    fn: function(){},
};
console.log(obj);

展开运行后的结果可以看到原型部分的结构:

image.png

关于原型和原型链相关的细节可参考之前的文章:JS进阶 | 原型和原型链解析

特点:

无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员。

语法:

obj.hasOwnProperty(prop)

如果看到这里还是没有能够完全理解到 hasOwnProperty 的含义,下面我们来执行以下代码就会很清晰了:

const obj = {
    a: 100,
    b:{
        c: 200
    },
    fn: function(){},
};
console.log(obj.hasOwnProperty('a'));  // true
console.log(obj.hasOwnProperty('b'));  // true
console.log(obj.hasOwnProperty('c'));  // false
console.log(obj.b.hasOwnProperty('c'));  // true,obj.b 有c属性
console.log(obj.hasOwnProperty('fn'));  // true

const str = new String();
console.log(str.hasOwnProperty('split'));  // false
console.log(String.prototype.hasOwnProperty('split'));  // true

运行结果:

image.png

上述代码中, obj.hasOwnProperty('c') 的返回值为 false,是因为 obj 对象没有 c 属性。如果想要在 c 属性上得到 true 的值,执行 obj.b.hasOwnProperty('c') 就可以返回 true。 split方法是String这个对象的方法,str对象本身是没有这个split这个属性的

另外需要注意的是:如果属性的值是 null 或 undefined,只要属性存在,依旧会返回 true。

兼容性

hasOwnProperty 在浏览器中的兼容性:

image.png