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()

相关推荐
两年半的个人练习生^_^10 小时前
每日一学:设计模式之原型模式
java·开发语言·设计模式·原型模式
UXbot1 天前
如何用 AI 快速生成完整的移动端 UI 界面:从描述到交付的实操教程
前端·ui·交互·ai编程·原型模式
神の愛2 天前
js的深拷贝和浅拷贝?啥情况讲解下??底层堆栈空间??object.prototype.toString.call(),还有bind,的具体使用?
前端·javascript·原型模式
W.A委员会3 天前
JS原型链详解
开发语言·javascript·原型模式
Rsun045513 天前
5、Java 原型模式从入门到实战
java·开发语言·原型模式
码云数智-大飞5 天前
JavaScript 原型链与继承机制:从底层原理到 ES6 Class 的本质
原型模式
妙蛙种子3116 天前
【Java设计模式 | 创建者模式】 原型模式
java·开发语言·后端·设计模式·原型模式
吴声子夜歌6 天前
ES6——Calss详解
javascript·es6·原型模式
UXbot8 天前
AI原型设计工具评测:从创意到交互式Demo,5款产品全面解析
前端·ui·设计模式·ai·ai编程·原型模式
xiaotao1318 天前
JS new 操作符完整执行过程
开发语言·前端·javascript·原型模式