【javascript】如何判断一个对象属性是否存在

前言

在javascript里,可以有多种判断对象属性是否存在的方法,使用哪种方法来判断,取决于对 “存在” 两个字的定义是什么。

方法1:对比undefined

const obj = {}
if (obj.id !== undefined) {
  console.log('存在')
} else {
  console.log('不存在')
}

此种方法的缺点是,如果对象真的有一个 id 属性,但是值为undefined的话,此方法会判断为 id 属性不存在。

方法2:使用Object.keys()

const obj = {id: 1}
if (Object.keys(obj).includes('id')) {
  console.log('存在')
} else {
  console.log('不存在')
}

Object.keys()可以获取到一个对象全部自有可枚举属性,如果一个属性不符合 “自有” 和 “可枚举” 这两个条件的话,Object.keys()是获取不到的,就会导致判断为属性不存在。

自有

“自有”的意思是这个属性是对象自己的,而不是在它的原型链上,比如:

const obj = {}

obj.id = 1 // 此时的id是obj的自有属性

obj.__proto__.id = 1 // 此时的id不是obj的自有属性
可枚举

每一个对象属性都有一个描述符,例如下面代码是获取 obj 对象 id 属性的描述符:

const obj = {id: 1}
console.log(Object.getOwnPropertyDescriptor(obj, 'id'))
// 输出:{value: 1, writable: true, enumerable: true, configurable: true}

输出内容中的 enumerable就是可枚举的描述符,值为 true 代表此属性可枚举可遍历,false 代表不可以。

如果我们给 obj 对象添加一个不可枚举的 id 属性,会发现使用Object.keys() 方法会判断为属性不存在:

const obj = {}
// 定义一个不可枚举的属性
Object.defineProperty(obj, 'id', {
  value: 1,
  enumerable: false
})

if (Object.keys(obj).includes('id')) {
  console.log('存在')
} else {
  console.log('不存在') // 输出:不存在
}

方法3:使用hasOwnProperty()

const obj = {id: 1}

if (obj.hasOwnProperty('id')) {
  console.log('存在')
} else {
  console.log('不存在')
}

此方法跟 方法2 相似,区别是此方法只需要满足“属性是自有的”这一个条件就可以了,而不管属性可不可枚举,都能获取到。

方法4:使用in

const obj = {id: 1}

if ('id' in obj) {
  console.log('存在')
} else {
  console.log('不存在')
}

此方法在本文提到的4种方法里,判断范围是最广的,不管属性是“自有的”还是“非自有的”,是“可枚举的”还是“不可枚举的”,它都能判断得出来。

你可能感兴趣的:(前端,javascript)