js 怎么判断对象是否具有某个属性及各方法的区别

目录

[prop in obj](#prop in obj)

obj.hasOwnProperty(prop)

[Object.prototype.hasOwnProperty.call(obj, prop)](#Object.prototype.hasOwnProperty.call(obj, prop))


prop in obj

使用 in 运算符来检查属性是否存在于对象中,包括原型链。

javascript 复制代码
let obj = {
    a: 'name', 
    b: 'sex'
}
Reflect.setPrototypeOf(obj, {c: 'age'})
'a' in obj // true 因为 a 是 obj 的直接属性
'c' in obj // true 存在原型链中
'v' in obj // false
'toString' in obj // true 因为 toString 是 obj 的原型方法
  • 如果对象 obj 或其原型链中包含名为 prop 的属性,则返回 true。

  • 如果对象 obj 不包含名为 prop 的属性,并且它的原型链上也不存在该属性,则返回 false。

  • 只能用在具体的对象上,不能用于 null 或 undefined

    javascript 复制代码
    let obj = null
    obj 
    // null
    'a' in obj
    // 报错 VM6874:1 Uncaught TypeError: Cannot use 'in' operator to search for 'a' in null

obj.hasOwnProperty(prop)

使用 hasOwnProperty 方法来检查对象是否直接拥有指定的属性,不包括原型链。

javascript 复制代码
let obj = {
    a: 'name', 
    b: 'sex'
}
Reflect.setPrototypeOf(obj, {c: 'age'})
obj.hasOwnProperty('a') // true 因为 a 是 obj 的直接属性
obj.hasOwnProperty('c') // false 存在原型链中,不是直接拥有
obj.hasOwnProperty('v') // true
obj.hasOwnProperty('toString') // false 因为 toString 是 obj 的原型方法
  • 如果对象 obj 直接拥有名为 prop 的属性,则返回 true。

  • 如果对象 obj 不直接拥有名为 prop 的属性,或者它的原型链上存在该属性,则返回 false。

  • 只能用在具体的对象上,不能用于 null 或 undefined

    javascript 复制代码
    let obj = null
    obj 
    // null
    obj.hasOwnProperty('a')
    // 报错 Uncaught TypeError: Cannot read properties of null (reading 'hasOwnProperty')

弊端

若被判断的这个对象自身也有一个名为 hasOwnPropery 的属性,这个时候 js 不会将hasOwnPropery 作为关键名进行保护。故而引出 Object.prototype.hasOwnProperty.call(obj, prop)。

Object.prototype.hasOwnProperty.call(obj, prop)

使用 Object.prototype.hasOwnProperty.call(obj, prop) 来检查对象是否直接拥有指定的属性,不包括原型链。

javascript 复制代码
let obj = {
    a: 'name', 
    b: 'sex'
}
Reflect.setPrototypeOf(obj, {c: 'age'})
Object.prototype.hasOwnProperty.call(obj, 'a') // true 
Object.prototype.hasOwnProperty.call(obj, 'c') // false
Object.prototype.hasOwnProperty.call(obj, 'v') // false
  • Object.prototype 上调用 hasOwnProperty 方法,并通过 call 来设置方法内部的 this 指向 obj,然后检查 obj 对象自身属性中是否存在 prop 属性

  • 可用于任何对象,包括 null 和 undefined,但如果对象为 nullundefined,将会抛出错误

    javascript 复制代码
    let obj = null
    obj 
    // null
    Object.prototype.hasOwnProperty.call(obj, 'a') 
    // 报错 Uncaught TypeError: Cannot convert undefined or null to object
    
    Object.prototype.hasOwnProperty.call(obj2, 'a') 
    // 报错 Uncaught ReferenceError: obj2 is not defined
  • 即使 obj 对象本身没有 hasOwnProperty 方法(例如,如果 obj 是通过 Object.create(null) 创建的),你也可以安全地检查 obj 是否有 prop 属性。

    javascript 复制代码
    let obj = Object.create(null)
    obj 
    // {}
    Object.prototype.hasOwnProperty.call(obj, 'a') 
    // false

在实际编程中,若不确定对象是否为 nullundefined,或想要在一些特殊的环境中(比如严格模式下)避免使用 this,应该使用 Object.prototype.hasOwnProperty.call()

相关推荐
道友老李2 天前
【设计模式精讲】创建型模式之原型模式(深克隆、浅克隆)
设计模式·原型模式
Samson Bruce3 天前
【创建模式-原型模式(Prototype Pattern)】
原型模式
強云4 天前
23种设计模式 - 原型模式
设计模式·原型模式
le_duoduo5 天前
原型模式详解(Java)
java·原型模式
lonelyhiker5 天前
javascript的原型链
开发语言·javascript·原型模式
新时代的弩力6 天前
Function.prototype.__proto__==Object.prototype
开发语言·javascript·原型模式
无限大.8 天前
前端知识速记—JS篇:原型与原型链
前端·javascript·原型模式
wy02_8 天前
【设计模式】 建造者模式和原型模式
设计模式·建造者模式·原型模式
ox008010 天前
C++ 设计模式-原型模式
c++·设计模式·原型模式
码了三年又三年11 天前
面向对象中的原型
原型模式