经典面试题之一:javascript如何判断对象是否具有某个属性?

91 阅读2分钟

判断对象是否有某个属性

话不多说,直接上干货:

1.使用in操作符

const obj = {
  name: '张三',
  age: 18
}
console.log('name' in obj) // true
console.log('gender' in obj) // false

2.使用hasOwnProperty方法

const obj = {
  name: '张三',
  age: 18
}
console.log(obj.hasOwnProperty('name')) // true
console.log(obj.hasOwnProperty('gender')) // false

3.使用Object.keys方法

const obj = {
  name: '张三',
  age: 18
}
console.log(Object.keys(obj).includes('name')) // true
console.log(Object.keys(obj).includes('gender')) // false

4.使用Object.getOwnPropertyNames方法

const obj = {
  name: '张三',
  age: 18
}
console.log(Object.getOwnPropertyNames(obj).includes('name')) // true
console.log(Object.getOwnPropertyNames(obj).includes('gender')) // false

5.使用Object.prototype.propertyIsEnumerable方法

const obj = {
  name: '张三',
  age: 18
}
console.log(obj.propertyIsEnumerable('name')) // true
console.log(obj.propertyIsEnumerable('gender')) // false

6.使用Object.hasOwn方法

const obj = {
  name: '张三',
  age: 18
}
console.log(Object.hasOwn(obj, 'toString')) // 返回 false
console.log(Object.hasOwn(obj, 'name')) // 返回 true

7.使用Object.entries方法

const obj = {
  name: '张三',
  age: 18
}
console.log(Object.entries(obj).some(([key]) => key === 'name')) // true
console.log(Object.entries(obj).some(([key]) => key === 'gender')) // false

8.使用Reflect.has方法

const obj = {
  name: '张三',
  age: 18
}
console.log(Reflect.has(obj, 'name')) // true
console.log(Reflect.has(obj, 'gender')) // false

这些方法面试时经常问,工作时经常用到。现代浏览器也都兼容。读者可以用以下代码自行验证。

const obj = {
    name: '张三',
    age: 18
  }
console.log('1.==============in==============')
console.log('toString' in obj) // 返回 true,因为 obj 继承了 Object.prototype 的 toString 方法
console.log('name' in obj) // 返回 true,因为 obj 本身有一个名为 'name' 的属性
console.log('2.==============hasOwnProperty==============')
console.log(obj.hasOwnProperty('toString')) // 返回 false,因为 toString 是继承的属性
console.log(obj.hasOwnProperty('name')) // 返回 true,因为 name 是对象本身的属性
console.log('3.=============Object.keys==============')
console.log(Object.keys(obj)) // 返回 ['name', 'age'],因为 name 和 age 是对象本身的属性
console.log(Object.keys(obj).includes('name')) // true
console.log(Object.keys(obj).includes('gender')) // false
console.log(Object.keys(obj).includes('toString')) // false,因为 toString 是继承的属性
console.log('4.==============Object.getOwnPropertyNames==============')
console.log(Object.getOwnPropertyNames(obj)) // 返回 ['name', 'age'],因为 name 和 age 是对象本身的属性
console.log(Object.getOwnPropertyNames(obj).includes('name')) // true
console.log(Object.getOwnPropertyNames(obj).includes('gender')) // false
console.log(Object.getOwnPropertyNames(obj).includes('toString')) // false,因为 toString 是继承的属性
console.log('5.==============propertyIsEnumerable==============')
console.log(obj.propertyIsEnumerable('toString')) // 返回 false,因为 toString 是继承的属性
console.log(obj.propertyIsEnumerable('name')) // 返回 true,因为 name 是对象本身的属性
console.log('6.==============Object.hasOwn==============')
console.log(Object.hasOwn(obj, 'toString')) // 返回 false,因为 toString 是继承的属性
console.log(Object.hasOwn(obj, 'name')) // 返回 true,因为 name 是对象本身的属性
console.log('7.==============Object.entries==============')
console.log(Object.entries(obj).some(([key]) => key === 'name'))// 返回 true,因为 Object.entries 返回的数组中包含一个键值对,其中键为 'name'
console.log(Object.entries(obj).some(([key]) => key === 'aaa')) // 返回 false,因为 Object.entries 返回的数组中不包含键为 'aaa' 的键值对
console.log(Object.entries(obj).some(([key]) => key === 'toString')) // 返回 false,因为 Object.entries 返回的数组中不包含键为 'toString' 的键值对
console.log('8.==============Reflect.has==============')
console.log(Reflect.has(obj, 'name')) // 返回 true 
console.log(Reflect.has(obj, 'gender')) // 返回 false
console.log(Reflect.has(obj, 'toString')) // 返回 true, 因为 toString 是继承的属性

总结:这些方法都可以判断对象是否具有某个属性,但可以分为两种:

  1. 准确判断自身属性:hasOwnPropertypropertyIsEnumerableObject.keysObject.getOwnPropertyNamesObject.hasOwnObject.entries
  2. 判断自身或继承属性:inReflect.has

最后,这篇文章有帮助到你,可以点个赞支持一下哈。