JavaScript如何判断对象中的属性存在自身还是原型链上

奶球不是球2023-11-15 9:23

1.in操作符

in 操作符会在通过对象能够访问给定属性时返回true，无论该属性存在于对象本身还是其原型链上。

javascript 复制代码

function Person(name) {
  this.name = name
}
let obj = new Person('Tom')

Person.prototype.gender = 'male'
Person.prototype.code = 23
console.log("name" in obj) // true
console.log('code' in obj) // true
console.log('gender' in obj) // true

2.obj.hasOwnProperty(prop)

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

对象本身有，返回true；反之，返回false。

javascript 复制代码

function Person(name) {
  this.name = name
}
let obj = new Person('Tom')

Person.prototype.gender = 'male'
Person.prototype.code = 23

console.log(obj.hasOwnProperty('name')) // true
console.log(obj.hasOwnProperty('code')) // false
console.log(obj.hasOwnProperty('gender')) // false

3.两者结合判断属性位于对象本身还是来自于其原型链

javascript 复制代码

function Person(name) {
  this.name = name
}
let obj = new Person('Tom')

Person.prototype.gender = 'male'
Person.prototype.code = 23

function propertyFormPrototype(obj, prop) {
  return obj.hasOwnProperty(prop) && prop in obj
  //当return为true时表示属性位于对象本身
}
console.log(propertyFormPrototype(obj, 'name')) // true
console.log(propertyFormPrototype(obj, 'gender')) // false
console.log(propertyFormPrototype(obj, 'code')) // false